search

Semantic-Org / Semantic-UI-CSS

CSS Only distribution
http://www.semantic-ui.com
MIT License
488 stars 362 forks source link

Wrong CSS syntax for background-color #56

Closed ppaczkowski closed 6 years ago

ppaczkowski commented 6 years ago

You are using kinda shady syntax for background-color. I have to import components manually for widgets and my devtools are not happy about that. background-color: none #FFFFFF !important; Example in release: (https://github.com/Semantic-Org/Semantic-UI-CSS/blob/master/components/label.css#L990)

Fix:

  1. One parameter too many. Good: background-color: #FFFFFF !important; or background-color: transparent !important;
  2. Using "none" with background-color is a bad idea(If you have to then use "transparent" instead). Look here (https://stackoverflow.com/questions/8739665/is-background-colornone-valid-css) 1
pdfowler commented 6 years ago

Visible side effect of this is on a basic green label. In Chrome, rather than rendering a label with a green outline and green text, it is rendered as a solid block of green (with nice round corners) 😡

OwenPattison commented 6 years ago

Its just invalid css - background-color takes a single property which is color. Attempting to use 2 is incorrect, also noneis not valid as a background-color, i've tried opening a PR to fix this issue but got this: image

ppaczkowski commented 6 years ago

Okay. Issue is handled here https://github.com/Semantic-Org/Semantic-UI/issues/6439. I am closing this one.