Why are these styles not visible in IE6

Posted by Laramie on Stack Overflow See other posts from Stack Overflow or by Laramie
Published on 2010-06-11T22:32:03Z Indexed on 2010/06/11 23:33 UTC
Read the original article Hit count: 300

Filed under:
|

Given the following markup

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML Strict//EN"><META http-equiv="Content-Type" content="text/html; charset=utf-8"> 
<HTML xmlns="http://www.w3.org/1999/xhtml">
<head>
<style type="text/css">
div.apartBox
{
    padding:12px;
    background: #FFFFFF;
    border: solid 1px #6182A3;
}
.browser
{
    background: #fff;
    border: solid 1px #0055E3;
    border-top: solid 12px #0055E3;
    border-bottom: solid 4px #7A99C5;
    padding:10px 10px 8px 14px;
    color: #333;
    font: 0.8em/1 arial;
    margin: 8px 20px;
}
.callout
{
     background: #EEF2F0;
     border: solid 1px #9CC7C0;
     padding:8px;
}

</style>
</head>

<BODY>

<div class="apartBox" id="subPopout" style="Z-INDEX: 2; WIDTH: 400px; POSITION: relative">
    <div id="upSubPop">
        <div class="callout" id="subDetails">
            <div class="browser">
            <span id="txtExample">Me afecta que digan que soy incapaz.</span>
            </div>
        </div>
    </div>
</div>

</BODY></HTML>

The styles from the css .browser and .callout are not visible in IE6 unless I manually remove the position:relative style from subPopout. This div is generated automatically from a modal popup so I unfortunately can't touch this style. It displays fine in FF. If I select the .browser div with my mouse, it displays when I unselect it!

© Stack Overflow or respective owner

Related posts about css

Related posts about internet-explorer-6