Skip to content

Issue with "border-color": (horizontal and vertical syntax wrong way around) #2789

@davidelrizzo

Description

@davidelrizzo

MDN URL: https://developer.mozilla.org/en-US/docs/Web/CSS/border-color

What information was incorrect, unhelpful, or incomplete?

/* horizontal | vertical */
border-color: red #f015ca;

/* top | vertical | bottom */
border-color: red rgb(240,30,50,.7) green;

Here "horizontal" would need to equate to "top & bottom" to match browser behaviour which is the opposite of what horizontal means. And same for "vertical"

Specific section or headline?

Syntax

What did you expect to see?

  • to match the border-style syntax and avoid confusion this should be written as:

/* top and bottom | left and right */
border-color: red #f015ca;

/* top | left and right | bottom */
border-color: red rgb(240,30,50,.7) green;

Did you test this? If so, how?

https://codepen.io/davidelrizzo/pen/gOLzgdG

MDN Content page report details

Metadata

Metadata

Labels

No labels
No labels

Type

No type

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions