Hi List,

I have a problem with IE6 not displaying the #ranking DIV. I have
searched but I can't find a reason for this problem and my normal
array of solutions to throw at IE6 problems has come up blank. I can't
link to the page on list, but if anyone needs to see it in action
please send me a message off-list. Otherwise the relevant code is
below.

Basically both the #thumbnail and #details DIVs are floated next to
eachother, and #details has 30px padding-left. I want the #ranking DIV
to display in that 30px gap.

-- START --

<div class="others">
        <ol>
                <li>
                        <div class="thumbnail">
                                <div>
                                        <a href="#">
                                                <span></span>
                                                <img 
src="images/dummy/melissa.jpg" alt="" />
                                        </a>
                                </div>
                        </div>
                        <div class="details">
                                <div class="ranking">2.</div>
                                <h3><a href="#">Melissa</a> <span>21</span></h3>
                                <div class="rating">
                                        <strong>Current Rating: 3 stars</strong>
                                        <ol class="three">
                                                <li class="one">
                                                        <a href="#">1 Star</a>
                                                </li>
                                                <li class="two">
                                                        <a href="#">2 Stars</a>
                                                </li>
                                                <li class="three">
                                                        <a href="#">3 Stars</a>
                                                </li>
                                                <li class="four">
                                                        <a href="#">4 Stars</a>
                                                </li>
                                                <li class="five">
                                                        <a href="#">5 Stars</a>
                                                </li>
                                        </ol>
                                </div>
                                <div>NSW</div>
                                <div>Lifesaver</div>
                                <div class="myprofile">
                                        <a href="#">My Profile</a>
                                </div>
                                <div class="voteforme">
                                        <a href="#">Vote For Me</a>
                                </div>
                        </div>
                </li>
        </ol>
</div>

.others                                 { background: #fff; color: #828282; 
font-size: 14px;
font-weight: bold; line-height: 16px; padding: 21px 23px; width:
611px; }
.others ol                              { float: left; list-style: none; 
margin-right: -30px; }
.others li                              { float: left; margin-bottom: 26px; 
width: 319px; }
.others div.thumbnail                   { float: left; }
.others div.thumbnail div               { background: #ddd; display: table-cell;
height: 149px; overflow: hidden; text-align: center; vertical-align:
middle; width: 149px; }
.others div.thumbnail div *             { vertical-align: middle; }
.others div.details                     { float: left; padding-left: 30px; 
padding-top:
11px; position: relative; width: 140px; }
.others div.details .ranking            { color: #720044; left: 9px; position:
absolute; top: 11px; }
.others div.details h3                  { float: left; font-size: 14px;
text-transform: uppercase; width: 140px; }
.others div.details h3 a                { color: #828282; }
.others div.details h3 span             { color: #3a3a3a; }
.others div.details .rating             { margin-bottom: 4px; }
.others div.details .myprofile a        { background:
url(../images/myprofile2.gif); display: block; height: 39px;
margin-left: -7px; margin-top: 4px; text-indent: -9999px; width:
105px; }
.others div.details .voteforme a        { background:
url(../images/voteforme2.gif); display: block; height: 21px;
margin-left: -1px; margin-top: 3px; text-indent: -9999px; width:
112px; }

-- END --

Thanks for any help guys, this one has had me scratching my head for hours.

Cheers,
Blake
______________________________________________________________________
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Reply via email to