Working in Chrome 12 but not in IE9 or FF5

Hi,

I am hoping someone may be able to give me clues as to how to solve a problem.

I have created a site based on a WordPress theme using html5. On the front page, which contains a mix of 9 thumbnails and 3 additional elements, it should line up in a pattern of first row - 4 thumbnails, second row - 3 thumbnails and another ‘box’, third row - 2 thumbnails and a further 2 ‘boxes’

In Chrome 12, the site works. In Internet Explorer 9 and Firefox 5 it doesn’t.

Funnily enough though, it does work in Internet Explorer 7.

Usually when this happens I will just keep working at it, using a process of elimination and although it may take me days and lots of hair-pulling, I generally get there in the end.

However, this time, I am almost hairless now and still not getting anywhere. I would imagine it some stupidity on my part, but for the life of me, I just cannot find the problem. It could be the html5 elements [mixed with too many divs as well] or more likely, the css.

The test site is at I Am LKC | I love airplanes and I have attached a screenshot of how the site is looking in Chrome [ignore the 'navigation error ‘Previous’ - that is another issue not related to this.]

If anyone is willing to take a look for me and point me in the right direction, it would be hugely appreciated.

Thanks for taking the time to read this thread.

Try giving #wrap a width.


#wrap{width:100%}

Seems to be a lot of unnecessary divs in there :slight_smile:

Thanks Paul.

You have been a great help!