[thelist] IE vs. Firefox display difference (follow-up)

Michael Slater michaels at adobe.com
Tue Feb 28 18:33:14 CST 2006

Thanks for those who replied to my message of a couple days ago (repeated
below) about an IE display bug. There were two solutions offered: absolute
positioning the div, and setting overflow:hidden. I didn't want to absolute
position it, because that would take it out of the flow and cause other
issues. I had already tried adding overflow:hidden to the offending div --
the one that contains a photo that should get truncated as the windows
narrows -- and this didn't work.

But prompted by the suggestion that the answer should lie there somewhere, I
tried wrapping everything in another div and giving that div the
overflow:hidden setting, and this has solved this problem. Thanks! I'm still
fighting some spacing bugs but at least the bugs are more minor now...

If anyone wants to take a look at the end results, the site is
www.BoatingSF.com, and and an example of the page with this issue is



Original message:

I'm struggling with a display behavior that I'm hoping folks on the list
will recognize.
Take a look at www.boatingsf.com/test.html. Try it in IE and in Firefox, and
try narrowing your window size as you look at it in each.
There is a fixed-width div floated to the left, and then a picture in a div
that sits next to it. It is a very simple piece of code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
<html xmlns="http://www.w3.org/1999/xhtml">
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>IE display bug test</title>
<div style='background-color: #99BBDD; float: left; width: 180px;
<p>Left Bar</p>
<div style='margin-left: 185px;'>
<img src='/photos/031105/DSC00727_edited-1.jpg'>
As long as the window is big enough to display the whole picture, Firefox
1.5 and IE 6 both show the same, expected behavior. But if the window is too
narrow to display it all, Firefox just truncates the right edge of the
picture (which is the behavior I want), whereas IE knocks the start of the
image down below the end of the left bar (which is a big problem!).
Am I doing something wrong here? Or is there a bug in IE that I need to work
Michael Slater

More information about the thelist mailing list