Re: [csswg-drafts] [css-backgrounds] 'border' shorthand resets 'border-image' but can't set it

Here's a use case for the other side of the equation:

In my design system, I have a class `big-warning-button`. It applies a very large red border:

button.big-warning-button {
  color: dakrRed;
  background: lightSalmon;
  border: solid 5px;

But then, someone down the line changes the theme styles for default buttons to use a `border-image` instead of a regular border:

button {
  border-image: url(/assets/fancy-border.png) 10 10 stretch;

If the `border` shorthand worked as proposed in this issue:

My big warning buttons are now broken. I check dev tools. The border width and border color are still there.  So is the `border-image` property, but it's assigned with a simple tag selector. Why is it overriding the border I set with a _class_ selector? I thought I understood CSS! This isn't how it's supposed to work! Why must everything be so darn complicated!!!  Stupid `border-image` keeps breaking everything. No wonder we never use it.

GitHub Notification of comment by AmeliaBR
Please view or discuss this issue at using your GitHub account

Received on Wednesday, 20 December 2017 23:07:44 UTC