Microsoft Developer Network > Forums Home > Internet Explorer Development Forums > Internet Explorer Web Development > IE9 doesn't display the correct marker for lists (UL, OL).

Answered IE9 doesn't display the correct marker for lists (UL, OL).

  • Saturday, March 19, 2011 8:40 PM
     
      Has Code

    IE9 doesn't display the correct marker for lists (UL, OL) when toggling a parent DIV from display:none to display:block.

    To duplicate the problem

    1. Load the following page, DIV 1 is shown by default, note the list markers are A. and B.
    2. Click on the "Show DIV 2" link, DIV 1 is now hidden and DIV 2 is shown, the list markers for second DIV are A. and B.
    3. Click on the "Show DIV 1" link, DIV 2 is now hidden and DIV 1 is shown BUT the list markers are now 0. and 0.

     

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
    <html>
    <head>
    <title>Test</title>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"/>
    <style type="text/css">
    .clsDisplayNone	{ display: none; }
    #divContent1 { border: 2px solid red; width: 300px }
    #divContent2 { border: 2px solid blue; width: 300px }
    #ulList1, #ulList2 { list-style-type: upper-alpha; }
    </style>
    <script language="JavaScript" type="text/javascript"><!--
    function doClick(oNavElm)
    {
    	switch (oNavElm.id)
    	{
    		case "Nav1":
    			document.getElementById("divContent1").className	= "";
    			document.getElementById("divContent2").className	= "clsDisplayNone";
    			break;
    		case "Nav2":
    			document.getElementById("divContent1").className	= "clsDisplayNone";
    			document.getElementById("divContent2").className	= "";
    			break;
    	}
    }
    // --></script>
    </head>
    
    <body style="background-color:white">
    
    <p>
    	<a id="Nav1" href="JavaScript:void(0);" onclick="doClick(this)">Show DIV 1</a>
    	<br/>
    	<a id="Nav2" href="JavaScript:void(0);" onclick="doClick(this)">Show DIV 2</a>
    </p>
    
    <div id="divContent1">
    
    	<ul id="ulList1">
    		<li>
    			DIV 1, UL-List-1, Line 1
    		</li>
    		<li>
    			DIV 1, UL-List-1, Line 2
    		</li>
    	</ul>
    
    </div>
    
    <div id="divContent2" class="clsDisplayNone">
    
    	<ul id="ulList2">
    		<li>
    			DIV 2, UL-List-2, Line 1
    		</li>
    		<li>
    			DIV 2, UL-List-2, Line 2
    		</li>
    	</ul>
    
    </div>
    
    </body>
    </html>
    

Answers

All Replies

  • Wednesday, March 23, 2011 7:17 AM
    Moderator
     
     Answered

    hi JerryB51,

    Thank you for posting!

    I recommend you post this issue to our Connect feedback portal. Our developer will evaluate them seriously and take them into consideration.

    Improving the quality of our products and services is a never ending process for Microsoft.

    thanks!


    Please mark the replies as answers if they help or unmark if not.
    If you have any feedback about my replies, please contact msdnmg@microsoft.com
    Microsoft One Code Framework
  • Wednesday, May 04, 2011 6:04 AM
     
     

    how to fixed this bug ?

  • Thursday, July 28, 2011 6:09 AM
     
      Has Code

    Put empty div tag before body tag, everything should be fine

     

    <div id="empty"></div>

    </body>

    let me know !!
  • Thursday, July 28, 2011 6:53 PM
     
     

    Did NOT work. Did you try it with the code above? If you did, you would have the same results. The only thing that fixes it is to display the page in compatiblity mode.

    I reported the problem to Microsoft Connect; The Internet Explorer Team was able to reproduce the issue. So far no workaround.


    Jerry