When you report a browser‐specific problem, you should also give the version of the browser that’s causing the problem. In other words, do you refer to Internet Explorer 6, 7, some other version, or all of them? I chose to view your document only in the latest version.
Concerning your problem, it hardly looks right to me in Firefox 2 either. I’m inferring that because the banner images are overlapping the text. On further review, this is because my resolution is 1280×1024 but you’ve designed the document to only display properly in one resolution: 1024×768.
As for a solution, I would probably simply change the method used to display those banner images. I would nest the #banner
element inside the #top
element and set those presentational banner images as CSS backgrounds of the #banner
element. Of course, each element can only have one background image assigned to it, so you would need to nest an additional div
for each background image unless
you combined them all into one image with transparency. To position those background images to the desired locations, you would simply use the background-position
Also, your XHTML contains errors
. Header elements cannot contain paragraph elements. Additionally, all elements must be closed in XHTML; there’s an unclosed paragraph element.