mutaweb
02-15-2007, 04:50 PM
Hello everybody,
this is my first post. Excuse me for my bad English and any other mistake regarding netiquette and forums.
I have been googling around for a solution for more than one hour, but I didn't come up with anything useful. I've tried the holly hack and other fixes but to no avail.
This is my situation: an absolutely positioned <div id="lingue"> contains the language selection toolbar for my site. The positioning is relative to a <div id="wrap">. A very common situation indeed. You can see it here (http://www.aroundtheworldinalotofdays.com/).
My page:
<div id="wrap">
<div id="testa"></div>
<div id="lingue" class="piccolo" align="left">
<img src="img/england.gif" alt="english" align="bottom"/><a href="http://www.aroundtheworldinalotofdays.com"><span style="margin:0 5px;">english</span></a>
<img src="img/italia.gif" alt="italiano" align="bottom"/><a href="index.php"><span style="margin:0 5px;">italiano</span></a>
</div>
[...]
</div>
My CSS:
#wrap {
width:785px;
margin:0px auto; /*center hack*/
text-align: center;
position: relative;
}
#lingue {
position: absolute;
left: 161px;
top: 102px;
width: 250px;
height: 10px;
}
FireFox shows the language div correctly.
IE6 and IE7 don't show the div at all. Well, the interesting part is in that you might see the div at times, but most of the times it doesn't show.
It was very impressing for me to watch the language flags appear and disappear while hitting the F5 key on IE.
I have absolutely no clue on what this could be and this is why I am asking you for help. I have only found out that setting width:100% to the wrap div fixes the problem (but it screws my layout).
I have a feeling that this behaviour is a consequence of something very silly mistake in my layout. Please help!
Thank in advance,
MutaWeb.
this is my first post. Excuse me for my bad English and any other mistake regarding netiquette and forums.
I have been googling around for a solution for more than one hour, but I didn't come up with anything useful. I've tried the holly hack and other fixes but to no avail.
This is my situation: an absolutely positioned <div id="lingue"> contains the language selection toolbar for my site. The positioning is relative to a <div id="wrap">. A very common situation indeed. You can see it here (http://www.aroundtheworldinalotofdays.com/).
My page:
<div id="wrap">
<div id="testa"></div>
<div id="lingue" class="piccolo" align="left">
<img src="img/england.gif" alt="english" align="bottom"/><a href="http://www.aroundtheworldinalotofdays.com"><span style="margin:0 5px;">english</span></a>
<img src="img/italia.gif" alt="italiano" align="bottom"/><a href="index.php"><span style="margin:0 5px;">italiano</span></a>
</div>
[...]
</div>
My CSS:
#wrap {
width:785px;
margin:0px auto; /*center hack*/
text-align: center;
position: relative;
}
#lingue {
position: absolute;
left: 161px;
top: 102px;
width: 250px;
height: 10px;
}
FireFox shows the language div correctly.
IE6 and IE7 don't show the div at all. Well, the interesting part is in that you might see the div at times, but most of the times it doesn't show.
It was very impressing for me to watch the language flags appear and disappear while hitting the F5 key on IE.
I have absolutely no clue on what this could be and this is why I am asking you for help. I have only found out that setting width:100% to the wrap div fixes the problem (but it screws my layout).
I have a feeling that this behaviour is a consequence of something very silly mistake in my layout. Please help!
Thank in advance,
MutaWeb.