...

View Full Version : What is causing my UL to go wrong in IE6/5.5?



moss2076
10-15-2007, 03:57 PM
I am designing a masthead and all looks fine in IE7, FF, Safari, Opera, but in IE5.5, and IE6 the "ul" called "leftmenu" is halfway across the screen. The UL should be lined up just to the right of the "thisisatest" title. All appears fine in IE7.

www.siteoftom.com/pages/masthead_2divs.html

Browsershots link to IE6 image -

http://browsershots.org/screenshots/d4ee45f34c488afa309489b4e956775e/

vexen
10-15-2007, 04:42 PM
this really looks like IE double horizontal margin on floated elements.

adding display:inline should fix the issue, read here : http://www.positioniseverything.net/explorer/doubled-margin.html

ul#leftmenu {
margin: 10px 0px 0px 240px;
padding: 0px 0px 0px 20px;
height: 34px;
list-style-type: none;
float: left;
display:inline;
background-image: url(../images/bannerimage_pinkred300.png);
background-repeat: no-repeat;
}

moss2076
10-15-2007, 04:52 PM
Yes that has fixed it :)

Many thanks for your help, much appreciated!

vexen
10-15-2007, 05:37 PM
no problem ;)

moss2076
10-15-2007, 06:01 PM
I have just noticed the problem is still occuring in IE5.5 but I have sorted it in IE6.

Whats up with IE5.5??

http://browsershots.org/screenshots/b2164790767562cca64502706c52f94a/

vexen
10-15-2007, 06:31 PM
sorry, i did some search but i do not understand the issue :confused:

moss2076
10-15-2007, 08:32 PM
Have a look at the screenshots -

IE5 (displaying the UL incorrectly) -
http://browsershots.org/screenshots/b2164790767562cca64502706c52f94a/

IE6 (displaying the UL correctly as I want it to) -
http://browsershots.org/screenshots/2db4b77fd41ec1c1f87dac0822db45a5/

IE5.5 is still making the margin go double in size.

vexen
10-15-2007, 09:02 PM
you could use this code this parse IE less than or equal 5.5 with half the margin, it *should* fix it!


<!--[if lte IE 5.5]>
<style type="text/css">
ul#leftmenu {
margin: 10px 0px 0px 120px;
}
</style>
<![endif]-->

moss2076
10-15-2007, 09:13 PM
I have just reloaded the Browsershots page and it seems to be ok now in both IE5.5 and IE6. The "display inline" does indeed seemed to have done the trick afterall. :thumbsup:

vexen
10-15-2007, 09:15 PM
i wonder why i was confused now! lol!

_Aerospace_Eng_
10-15-2007, 09:37 PM
Question. Are you on a Mac or PC? If you are on a PC you can run multiple IE browsers you know?

moss2076
10-16-2007, 02:47 PM
Im on a pc, as far as I know I cannot run IE6 or IE5 with Windows Vista IE7 installed. You cannot install IE6 when IE7 is already there.

I do run FF, Opera, safari and IE7 however.

You have to dual boot a few operating systems or use a virtual machine say with windows xp and ie6 installed.

srule_
10-16-2007, 03:19 PM
On a side not:

If you change the default text size everything gets thrown off. You should consider that some people like to browse with bigger or smaller text sizes then the default

moss2076
10-16-2007, 04:03 PM
On a side not:

If you change the default text size everything gets thrown off. You should consider that some people like to browse with bigger or smaller text sizes then the default

How do I get around different text sizes?

_Aerospace_Eng_
10-16-2007, 04:09 PM
Im on a pc, as far as I know I cannot run IE6 or IE5 with Windows Vista IE7 installed. You cannot install IE6 when IE7 is already there.

I do run FF, Opera, safari and IE7 however.

You have to dual boot a few operating systems or use a virtual machine say with windows xp and ie6 installed.

Yes you are correct. I use Vista and I had to install Virtual PC with Windows XP and IE6. I was assuming you were on Windows XP already.

As to the text sizes, to get around that you just have to make sure your layout is scalable height wise meaning you really don't want to set heights to too many things. If you want to set the height then perhaps you should use images where you need to.

moss2076
10-16-2007, 05:14 PM
As to the text sizes, to get around that you just have to make sure your layout is scalable height wise meaning you really don't want to set heights to too many things. If you want to set the height then perhaps you should use images where you need to.

How do I make my text resize in relation to when a user alters the text size? I dont want my images to go out of line with each other. Say for example like in this webpage (www.codingforums.com) everything resizes nicely and stays in the correct postion. I have a set about 3 heights in px on my masthead.



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum