CSS DIV Text Showing Higher Then Wanted


I am developing http://www.1tm.com and the fading slideshow text works great in FireFox but shows up higher then I want in IE and Opera.

Someone said to try this code bus does not work:

<div id=“photos” class=“galleryview” style=“visibility: visible; position: relative; margin: 0pt; background: none repeat scroll 0% 0% black; border: medium none; width: 696px; height: 220px;”>

Thanks for any help!

This seems to be the same question you already asked!

One last problem the text in the faded slide show shows up a little high in IE. How would we fix this so it works like FireFox?

Did you try my suggestion in that thread?

It put it in place but now its cutting off some of the text in IE, but every other browser it works great. Any suggestions?



The main suggestion would be to recode that page because (as mentioned before) you are utilising quirks mode which effectively makes all versions of IE behave like IE5 and you lose any benefits of the newer browser.

However you can’t just change the doctype because the page is built on the shaky foundation that is quirks mode and wouldn’t work in standards mode because you have used deprecated and unsafe techniques (such as not providing units for your dimensions).

To fix IE you need to add position:relative to the h2 due to the way that you have positioned it otherwise IE hides the bits that stick out of its container.

h2 {
    margin: 1em 0 0;
[B]    position:relative;[/B]