What could cause a bold tag <b> to be ignored?

Question

I have an issue with some HTML displayed in Drupal, but I am not 100% sure this is a Drupal issue. I am using the bold tag to emphasize a word, but it is not displayed as bold. It thought it might be the Google font I used, so I disabled it, but I still get the issue.

I checked the page source:

<div id="begin_block">
  <div id="fw_begin"><h2>Find words <b>beginning</b> with:</h2></div>
    <div id="inp_begin"><input type="text" /></div>
    <div id="aft_begin">(max. 5 characters)</div>
    <div id="but_begin"><button type="button">Go</button></div>
</div>

But I still get:

What could be causing this issue?

UPDATE

There is indeed a reset.css in the theme I am using. Bold is defined as:

b{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline}

Answer 1

A CSS (reset) sheet has probably defined b{font-weight:normal;}. To "fix" the style, add b{font-weight:bold;}.

Also, he <strong> tag is semantically more correct, so use that instead of <b>.

Answer 2

What you need to do is to use firebug or google's developer console in order to debug it. If you do not have any prior experience with at least one don't worry - it will pay of to spend some time and to learn it.

As the real solution, you could wrap your text in <span> instead of <b>, add it some meaningful class like "stress" (but you should avoid class names like "bold" because you might end up with changing your mind and instead of font-weight you will use underline, and in such case you will either change a class name or have bold class for underline style) and add to it something like

.stress{
 font-weight: bold !important;
}

Most likely you overwrite font-weight somewhere and important will ensure that it won't get overwritten anymore.

BTW: of course you do not have to use <span> with a class name, you can also use other selectors like <strong> etc.

Answer 3

b {
    font-weight: bold;
    font-family: inherit;
}

If the font family is not defined, the font in the wrapper element becomes override.