CODEWITHSUNDEEP
htmlcssinternet-explorer-8
Julie Alchin
Julie Alchin

Reputation: 1

font-family not showing in IE8

I'm just trying to add a regular font-family to my website, but IE8 won't display it. It just displays its default Times New Roman. This is my CSS:

body {
font-family: Arial, Helvetica, sans-serif;
}

This appears fine on IE7, 9 and obviously Chrome and Firefox but I'm not sure why IE8 is having issues?

My doctype is: 

<!DOCTYPE HTML>

I'm really stuck on this. It's such a simple thing, I'm not sure why IE8 is not liking it. Any help would be very much appreciated.

Thanks, Julie

Upvotes: 0

Views: 437

Answers (1)

Daniel
Daniel

Reputation: 516

I had the exact same problem that was driving me nuts!

Ok, so my scenario was running Drupal 7, with bootstrap and using html5shim.js and respond.js to support media queries etc in ie8

One requirement of this setup is that css aggregation needs to be disabled for Respond to work correctly... Also with bootstrap it is very possible to exceed ie8's 4096 selector limit, so I took care to disable certain components to make sure that I came in under this!

So my problem was that once css aggregation was enabled, despite showing in ie8's (excuse for an) inspector, it always seemed to revert to times new roman, ie8 and other browsers default font!? Disable either respond or css aggregation, and everything works as expected, including the right fonts in ie 8!!!

Ok, so it turns out as mentioned by Julie previously, when I remove font: inherit from the meyer reset, everything seems to work as normal. This is counter intuitive as you would expect css to cascade, and any later values should override an earlier declared one. Also why does font: inherit cause ie8 to ignore fonts even if they are declared later?

So the fix here seems to be to remove font: inherit (which I thought was how css worked anyway), and enable css aggregation and see respond working as expected in ie8!?

Upvotes: 1

Related Questions