font, color etc not working in IE8

[DLR]

Hi All, I’m having some trouble with IE8 and below. the following css;

#about_text .headline {
font-family:’Chelsea Market’, cursive;
font-size:1.1em;
font-weight:normal;
color:#FC941A;
}

#about_text .para{
text-align:justify;
font-size:0.75em;
}

is working fine in Chrome, Firefox, Safari and IE9, but not in IE8 or compatibility mode.
Any ideas appreciated.

[djrolstad]

post in codepen.io

[Senff]

Which one of these did you use?

about_text.headline
about_text .headline
.about_text.headline
.about_text .headline
#about_text.headline
#about_text .headline

Asking because what you have up there is not right (no period or # before “about_text”).

Regardless it would be better to give us a link to your site so we can see it in context.

[DLR]

I used

#about_text .headline

[DLR]

Sorry, don’t understand why, but the # is getting dropped from #about_text when I post the comment.

[Paulie_D]

We’d need to see the live page (or Codepen)

[DLR]

Live page is http://ticktockbox.com.au/g/1243204/the-tick-tock-box.html

[Paulie_D]

And what element is that CSS being applied to.

Is this done using a CMS because the markup is really odd?

[Paulie_D]

Are you using a EOT font for IE8 support?

[DLR]

If it looks like a hack, that is because I am using a hosted shopping cart and I am adding code to customise its appearance. That css is being applied to the main text on that page.

[DLR]

the font is from google fonts

[DLR]

sorry, gave you link to wrong page, (though I have the same problem on the page I did give link to), correct page is http://ticktockbox.com.au/g/1241607/about-tick-tock.html

[Paulie_D]

I don’t know if it’s related but there is a div with a class of `CustomPage` a few parent levels up that has Verdana applied to it.

[CrocoDillon]

That markup kills kittens… table inside table, inside more table… still not enough tables… wait, I found the 5th? nested table, maybe more. Fubar is what’s coming to my mind but I don’t think it comes close. And everything in a form? Okay enough ranting.

How was Tick Tock Box Born?

There is no `h` element. Only `h1`…`h6`. IE won’t style it, other browsers will (just like ‘unknown’ HTML5 elements).

By the way… 19 tables?

[DLR]

Thanks CrocoDillon (and everyone else who contributed) you hit the nail on the head with the h element – changed it to

and works perfectly now.
As for the many tables, I am using a ready made template provided by the shopping cart/web hosting outfit I am using (ashop.com). The tables are theirs, not mine. I am new at this. Thanks again.

[Author]

Posts