Question

我有三个浮动，我需要它在三个div，因为顶部浮动是动态像youtube扩展视频选项。无论如何以下是三个浮子，两个在左边，一个在右边，右边的浮子只在第二个浮子右边，但是不会移动到更高的位置。

<center>
<div style="width: 1024px;">
    <div style="width: 100%;">
       header content here..
    </div>
    <div class="clear"></div>
    <div style="width: 630px; float: left">
        video here...   right float should show next to this box, sence this is below the header...
    </div>

    <div style="width: 630px; float: left">
        comments here and other options...
    </div>

    <div style="width: 230px; float: right">
       related videos here..   (this box goes above and touchs the comment area only, but does not go all the way up to video area, what im doing wrong? btw i cant put comment and video in same div, because of some dynamic feature.
    </div>
</div>
<center>

注意：我无法更改div订单......

Answer 1

<center>

    <div id="wrap" style="width: 1024px;position:relative;">

        <div id="header" style="width: 100%;">
       header content here..       header content here..       header content here..       header content here..       header content here..       header content here..       header content here..       header content here..       header content here..       header content here..       header content here..       header content here..       header content here..       header content here..       header content here..       header content here..       header content here..       header content here..       header content here..       header content here..       header content here..       header content here..       header content here..       header content here..       header content here..       header content here..       header content here..       header content here..       header content here..       header content here..
        </div> <!-- END OF id=header-->

        <div class="clear"></div>

        <div id="leftColumn" style="width: 630px; float: left;">

            <div id="video">
                video here...
            </div>

            <div id="comments">
                comments here and other options...
            </div>

        </div> <!-- END OF id=leftColumn-->

        <div id="rightColumn" style="width: 230px; float: right;">
       related videos here..   (this box goes above and touchs the comment area only, but does not go all the way up to video area, what im doing wrong? btw i cant put comment and video in same div, because of some dynamic feature.
        </div> <!-- END OF id=rightColumn-->

    </div> <!-- END OF id=wrap-->

</center>

http://jsfiddle.net/borayeris/tDdvA/

css 3浮动问题

1 个答案: