FIX: <DIV> Tags Are Positioned Incorrectly in Internet Explorer 4.01 (182688)


The information in this article applies to:

  • Microsoft Internet Explorer (Programming) 4.01
This article was previously published under Q182688

SYMPTOMS

Placing two <DIV> tags on a Web page with relative positioning causes the second <DIV> to be positioned to the right of the first. In Internet Explorer 4.0, the second <DIV> is positioned below the first.

RESOLUTION

Place a <BR> or <P> tag after the first <DIV> tag.

STATUS

Microsoft has confirmed that this is a bug in the Microsoft products that are listed at the beginning of this article. This bug was corrected in Microsoft Internet Explorer 5.

MORE INFORMATION

Steps to Reproduce Behavior

  1. Load the following HTML into Internet Explorer 4.01:
    <HTML>
<BODY>
  <DIV ID=one STYLE="position:relative;width:200"
     onclick="document.all.two.style.display = '';">
  Div One
  </DIV>

  <DIV ID=two STYLE="position:relative;width:200;display:none">
  Div Two
  </DIV>
</BODY>
</HTML>
  2. Click "Div One."
Result: "Div Two" is displayed to the right of "Div One" off the screen. If you resize the application's window, it repositions to below "Div One."

Expected Behavior: "Div Two" should be displayed below "Div One." This worked in Internet Explorer 4.0.

Placing a <BR> or a <P> after the first </DIV> corrects this problem but places an extra line break between the two <DIV> tags. This HTML works correctly: 
<HTML>
<BODY>
  <DIV ID=one STYLE="position:relative;width:200"
     onclick="document.all.two.style.display = '';">
  Div One
  </DIV>

  <BR>

  <DIV ID=two STYLE="position:relative;width:200;display:none">
  Div Two
  </DIV>
</BODY>
</HTML>

REFERENCES

Dynamic HTML section of the Internet Client SDK Help:

http://www.microsoft.com/msdn/sdk/inetsdk/help

Modification Type:MajorLast Reviewed:10/15/2002
Keywords:kbBug kbie500fix KB182688
©2002 Microsoft Corporation. All rights reserved.