Knowledge Base

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

Article ID: 182688

Article Last Modified on 10/15/2002


APPLIES TO


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:

Keywords: kbbug kbfix kbie500fix KB182688