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?

András Gyömrey
  • 1,770
  • 1
  • 15
  • 36

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
  • 126,410
  • 34
  • 208
  • 218
1

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

DividedByZero
  • 4,333
  • 2
  • 19
  • 33
  • `!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