Msg#: 4029355 posted 5:01 pm on Nov 21, 2009 (gmt 0)
Most peoples know about IE double margin/padding bug.
I have searched and found some solutions for this but my case is odd one. I am displaying a div within a div. Internal div must be 200 pixels away form the outer one (Margin-Left). FF displays is correctly but IE doesn't. The div is not floated, displayed as block and contains some inner inline elements. If I set float:none, no change appears. If I set display to inline the whole structure messes up and the desired effect not appear (FF shifts downward).
Msg#: 4029355 posted 7:51 pm on Nov 21, 2009 (gmt 0)
Just add the code that you need for all browsers but IE to your normal stylesheet and ignore IE flat out. Then for each version of IE that you both care for and has a problem with that code: use a conditional comment and adjust what you need changed. It's working around bugs, so just halving the margin to compensate for the browser doubling it is a very good solution. Since for all other browsers (even future IE versions that should not have that bug anymore), see the conditional comment as a plain comment there's no danger they'll parse it by accident. Leaving them to only see normal sound code without any fixes at all. You rendering will be far more stable into the future.
Msg#: 4029355 posted 5:29 pm on Nov 23, 2009 (gmt 0)
sorry I didn't see your later reply, before I posted my question..
Yes there should be a way to fix it without IE specific code, but first we need to isolate the issue and see what is so different about your case. In my experience if it is the double margin bug the well documented fixes should work, if it's not working it's possible it's not the same bug or even a bug at all.
So can you make up a sample of the code, along with ul/li css, are you trying to get the images to display across the way or up and down? Which version of IE? If you use colours as backgrounds to the two divs and the <ul> it might help describe what you're seeing and what you want to see.