Different effect of bold tag in IE and chrome

I have surrounded the text with bold开发者_Go百科 tag, It renders differently in IE and Chrome.

IE image -->

Chrome image -->

Can anyone please figure out what can be done here?

Thanks

Both browsers have a different rendering/layout engine, the results could most likely different.

• IE 8 uses Trident 4.0
• Chrome uses Webkit 53n.##

It is a matter of taste and applied experience of the developers on both sides that delivers a different interpretation on how to render fonts (and pictures, and HTML etc...)

But in most cases, it does not matter ;).

More stuff here and here

IE and Chrome render <b> tag differently usually due to the browsers default CSS and how the engine decides to render it a fix to get them close to the same would be to use css.

<b id="example">Time</b>

#example {
font-weight:bold;
font-size:20px;
}

However in truth you will have to expect some differences in appearance on each browser only you can decide what is an acceptable difference :)

Try using <strong> instead. It may be more consistent. Also, make sure the font is the same size in each browser? Is it explciitly set?

Apart from that, Chrome and IE render things differently. IE may make text wider, using ClearType.

There's a discussion about disabling ClearType here: IE8: Disable cleartype?

Short of cutting all your text as images, there's nothing you can do about this. Rendering engines, installed fonts, ClearType tuning/disabling, user preferences, etc. will all conspire against you when it comes to web typography.