Databases
StackOverflow2013
Postsdbo
POCSS Float and Position not working in IE6
Body
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POCSS Float and Position not working in IE6
    text
    copied!<p>I have a problem regarding the CSS Float and Position in IE6, the Tree View I implemented the 2nd level child is not display to left when mouse hover, this is not happen in IE7-9 and other browser (Mozilla FireFox &amp; Chrome) but IE6.</p> <p>please find my sample Tree View code fragment as below:</p> <pre><code>&lt;style type="text/css"&gt; .treeView { font-family: Century Gothic; font-size: 13px; font-weight: bold; color: #ff6500; } /* hyperlink style */ .treeView a { color: #ff6500; text-decoration: none; } /* hyperlink hover style */ .treeView a:hover { color: #ff6500; text-decoration: underline; } .treeView ul { list-style: none; margin: 0; padding: 0; width: 246px; } .treeView ul li { height: 100%; background: #def0f6; position: relative; float: left; width: 100%; z-index: 3; } /* item background color */ .treeView li { background: #def0f6; border-top: 1px solid #007dc6; border-left: 1px solid #007dc6; border-right: 1px solid #007dc6; } .treeView ul li a, .treeView ul li span { display: block; padding: 5px 8px 5px 15px; } /* hide and align child item, and child width */ .treeView ul ul { position: absolute; top: -1px; visibility: hidden; } /* item background color when hover */ .treeView li:hover { background: #ffffd8; } /* display child item when hover parent item */ .treeView li:hover &gt; ul { visibility: visible; } /* align 2nd child item to left when hover parent item */ .treeView li:hover ul { display: block; left: 246px; } &lt;/style&gt; &lt;div class='treeView'&gt; &lt;ul&gt; &lt;li&gt;&lt;span class='submenu'&gt;Level 1&lt;/span&gt; &lt;ul&gt; &lt;li&gt;&lt;a href='#' class='submenu'&gt;Level 2&lt;/a&gt; &lt;ul&gt; &lt;li&gt;&lt;a href='#'&gt;Level 3&lt;/a&gt;&lt;/li&gt; &lt;/ul&gt; &lt;/li&gt; &lt;/ul&gt; &lt;/li&gt; &lt;/ul&gt; &lt;/div&gt; </code></pre> <p>I suspected it is due to the CSS Float:left and Position:Relative. Any idea how is float:left work in IE 6? Please help</p> <p>Thank you in advanced. </p>
 

Querying!

 
Guidance
An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload