<OL> in IE9

HTML & CSS
1

Hey there,

I’m having an issue in IE9.

On this page (and another like it)

The top 3 items in Large Cases should be numbered. Everything is fine in IE 8 and 7, FF and Chrome. But for some reason they do not show up in IE9. Not sure if it’s something in the OL styles or if it’s something to do with the image to the left of it.

Any ideas?

Thanks,
Daniel

2

There are 13 W3c validator errors in your HTML5.

I assume you are aware html5 is still in development and won’t be released as “official” by the W3C for a few years yet. Consequently browser support for html5 currently varies greatly. But I don’t think html5 is the main source of your problems here.

If you look through the html structural errors in your code you will see that it would fail even html4 validation. Fix the html errors and your problems should hopefully disappear.

When used correctly, <ol> works fine in IE9.

3

Hello,

Thanks for your help. I made some modifications and the page is now valid (in html4 as well). However the issue I’m having in IE9 is still there. Any other suggestions?

4

Hm, the problem is that the numbers are being hidden behind the floated image. One solution I can think of is to give a special class to that first OL (e.g. <ol class="first">) and then change the left margin on it:

ol.first {margin-left: 270px;}
5

Thanks Ralph,

That worked!

Daniel

6

Great! Thanks for the feedback. :slight_smile: