Geek Answers Handbook

Can't style the text on the enter button in bold?

I am trying to style the font in the enter button as bold.

Here is my code:

<input type="submit" id="nm-match" class="nm-button" value="Match" />

Here is my CSS:

 .nm-button { text-transform: uppercase; padding: 5px; color: blue; font-weight: bold; }

All styles are applied separately from bold.

Here JSFiddle shows the problem: http://jsfiddle.net/CJg43/1/

UPDATE: Why closed voices? Here's a screenshot of what it looks like for me on Chrome on MacOS:

enter image description here

UPDATE 2: ... and for comparison here, what it looks like with the solution ( background-color: white ) - http://jsfiddle.net/CJg43/23/

enter image description here

+6
source share
2 answers

Do you use chrome for MacOS? If so, try adding a background color to the button to see if it fixes it. Aqua styles can interfere by default. You can also try -webkit-appearance: none; or -webkit-appearance: button; .

+5
source

When you use numeric values ​​with the font-weight property and want to use bold , use a value greater than or equal to 700

 .nm-button { text-transform: uppercase; padding: 5px; color: blue; font-weight: 700; }

Js fiddle demo

+3
source

More articles:


All Articles