<div style="display:hidden"> not working in IE

aashen

I'm building a new site and using the Lightbox2 photo gallery(http://www.huddletogether.com/projects/lightbox2/). I have several images...each open up their own gallery. I was having a problem with my cells increasing in height when applying the galleries to the image source. A forum member from Lightbox suggested using <div style="display:hidden">.....which works well in Firefox 2 and Netscape 8, but not in IE6(not sure about IE7). I know many people who still use IE6 so its preferred that IE6 is able to properly load the webpage. My layout doesn't shift in Dreamweaver but when viewed on the web using IE6, the cell still shifts. The following is a portion of my source code:

<tr>
<td width="167" height="32" valign="top">
<a href="images/pic1.jpg" rel="lightbox[imageset]"><img src="images/designer.gif" width="167" height="32" border="0"></a>
<div style="display:hidden">
<a href="images/pic2.jpg" rel="lightbox[imageset]"></a>
<a href="images/pic3.jpg" rel="lightbox[imageset]"></a>
</div>
</td>
</tr>

The following link is the webpage I'm working on. Notice in IE the space under the name "Candace Ang":

http://marybrennanco.com/designer_test.html

From my research online, IE doesn't seem to do well with DIVs. Haven't been able to find a fix for my problem. Any suggestions would be greatly appreciated...this appears to be the last hurdle.

Thank You ahead of time.

Tony

Death Slaught

Quote:

Originally Posted by aashen

I'm building a new site and using the Lightbox2 photo gallery(http://www.huddletogether.com/projects/lightbox2/). I have several images...each open up their own gallery. I was having a problem with my cells increasing in height when applying the galleries to the image source. A forum member from Lightbox suggested using <div style="display:hidden">.....which works well in Firefox 2 and Netscape 8, but not in IE6(not sure about IE7). I know many people who still use IE6 so its preferred that IE6 is able to properly load the webpage. My layout doesn't shift in Dreamweaver but when viewed on the web using IE6, the cell still shifts. The following is a portion of my source code:

<tr>
<td width="167" height="32" valign="top">
<a href="images/pic1.jpg" rel="lightbox[imageset]"><img src="images/designer.gif" width="167" height="32" border="0"></a>
<div style="display:hidden">
<a href="images/pic2.jpg" rel="lightbox[imageset]"></a>
<a href="images/pic3.jpg" rel="lightbox[imageset]"></a>
</div>
</td>
</tr>

The following link is the webpage I'm working on. Notice in IE the space under the name "Candace Ang":

http://marybrennanco.com/designer_test.html

From my research online, IE doesn't seem to do well with DIVs. Haven't been able to find a fix for my problem. Any suggestions would be greatly appreciated...this appears to be the last hurdle.

Thank You ahead of time.

Tony

go here and enter your web address and you will get a list of errors fixing them may help it may not.

Thanks, Death

PS- to get a list of the errors you got to click on whatever is says next to "jump to".

epots9

hidden is not a value you can asign to display, what you would want to use is:

Expand|Select|Wrap|Line Numbers

 
/*hides the element(s)*/

display: none;

/*shows the elements(s)*/

display: block;

good luck

xoinki

Thnx this helped me :)

Regards,
Xoinki

garrow

Alternatively if you want to hide an element, but leave a space as if it was still here you can use

Expand|Select|Wrap|Line Numbers

element { visibility: hidden; }

<div style="display:hidden"> not working in IE

re: <div style="display:hidden"> not working in IE

re: <div style="display:hidden"> not working in IE

re: <div style="display:hidden"> not working in IE

re: <div style="display:hidden"> not working in IE

Similar HTML / CSS bytes

/bytes/development

/bytes/it

/bytes/about