IE6 displays the page different. Help!

[manish 0]

Hi,

 

I am building a website in CSS and XHTML. The page I have made so far dislays perfectly in Firefox and Safari, but IE6 throws up something completely different.

 

Here's the link. The CSS is in the same page. http://www.freshlimesoda.co.in/ansh/inventive/latest.html

 

Please help!!

[falkencreative 49]

You'll need to experiment, but you probably need to give your menu's li elements "float:left" -- experiment with that.

[manish 0]

I already have 'float:left' assigned to the li elements. still doesn't work.

[falkencreative 49]

Where? I'm not seeing it in your code anywhere. I see that you are floating the elements within the

but not the

s themselves.

[manish 0]

Ok! That has fixed the links. Thanks!!!!

 

This has corrected the

problem and the links are showing in a single line. But the bar at the bottom is still not displaying properly. I have used absolute positioning for the bar.

[falkencreative 49]

Try adding "clear:both" to #backpopup, and then post back... If you have to, you could always use conditional comments to target IE specifically and position the bar just for that particular browser.

[manish 0]

Worked!! But there is still one problem. When i rollover the the mouse the rollover bar still shows in the previous position, which is after the end of the links. I tried adding 'clear:both' to the span element, but doesn't work.

 

Thanks a lot for all your help

[falkencreative 49]

I'm not totally sure... You may try adding "display:block; float:left; clear:both" and see if that does it. That's just a guess though. As I said above, you could just add a conditional comment just for IE6 that gives the span a negative left value to move it into place.

[manish 0]

The conditional comment worked perfectly.

 

Thanks a lot for your help.

[falkencreative 49]

No problem -- glad to see you got it working.