| Bold and Strong Tags not Working |
|
|
|
| CSS - Styling |
| Monday, 11 July 2011 09:04 |
I had a friend call and ask me to look at a page. The problem was, neither the <b> tag, nor the <strong> tag were having any effect in multiple browsers.
I looked at the code, it looked well-formed. I ran it through a validator and it had some minor problems, but nothing I could relate to the mysterious 'bold not working' problem. I tried an Internet search but couldn't actually find any related articles. And that's why I'm writing this.
When I studied the bold text in Chrome's developer tools (SHIFT-CNTRL-I in Chrome, I like better than Firebug, which also rocks), I notice that Chrome had applied a style (font-weight:bolder) I had never heard of, and the computed weight was 300.
The culprit was a body styling: font-weight:100. All Chrome was doing for the bold and strong tag was adding 200, making the bold weight 300 -- not enough!. Changing the body style to font-weight:normal; fixed the problem.