2

Semantic-Ui seems to provide only uppercase buttons (via text-transform). What's the best way to use this UI framework without CSS modifying my button's case?

Andras Gyomrey
  • 1,652
  • 13
  • 34

2 Answers2

2

In your own CSS, simply set text-transform to initial:

.ui.button {
    text-transform: initial;
}

The initial property will make your button's text adhere to the text placed within the HTML.

HTML    Uppercase    Initial
Foo     FOO          Foo
fOO     FOO          fOO
FOO     FOO          FOO
James Donnelly
  • 122,518
  • 33
  • 200
  • 204
1

Apply text-transform:none !important; to your buttons.

DividedByZero
  • 4,289
  • 2
  • 18
  • 31
  • `!important` is bad practice and can almost always be avoided. – James Donnelly Oct 21 '14 at 15:54
  • 2
    I don't hate anyone. `!important` is just bad practice. http://stackoverflow.com/questions/3706819/what-are-the-implications-of-using-important-in-css. If the property doesn't override existing properties without `!important` specified, you can almost always solve the problem by increasing your selector's specificity. – James Donnelly Oct 21 '14 at 15:59