Hi,

I'll get right to it.
I have a page where 3 divs are floated left within a containing div that is set as a block level element. When I test this on a PC, in Firefox I'm seeing what I want—the three boxes align horizontally. However in IE 6, 5.5, 5.0 these divs are stacking vertically.


Here is the test page URL: http://tinyurl.com/9ns9b

The simple style sheet served to all browsers is here: http://tinyurl.com/ab2ts
The complex style sheet served to the select browsers is here: http://tinyurl.com/9dwus


Here is the relevant css within *complex* to the elements in question:

#productLines
{
        width: 550px;
        height: 270px;
        margin: 0px;
        padding: 0px;
        display: block;
}

#productLines h2
{
        width: 0px;
        height: 0px;
        margin: 0px;
        padding: 0px;
        display: none;
}

#ventura
{
        width: 183px;
        height: 270px;
        float: left;
        background: repeat-y url(../i/selectionBackground.gif);
        display: inline;
}
#bravo
{
        width: 183px;
        height: 270px;
        float: left;
        background: repeat-y url(../i/selectionBackground.gif);
        display: inline;
}
#plus
{
        width: 184px;
        height: 270px;
        float: left;
        background: no-repeat url(../i/product_plusBkgd.gif) transparent;
        display: inline;
}

#ventura p, #bravo p, #plus p
{
        margin: 5px;
        padding: 0px;
        font: .8em/1em Arial, Helvetica, sans-serif;
        height: 25px;
        text-align: center;
}
        

Can someone take a quick peek?
Thanks!
Bert
______________________________________________________________________
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Reply via email to