css - Div 对齐 FireFox, IE7, IE6

Question

我在对齐 IE6、IE7、IE8 和 Firfox 3 中的几个 div 时遇到问题。它们都不能正确呈现 IE8 和 Firefox，而其他 IE8 和 Firefox 则不能。

是否可以通过浮动和清除来做到这一点..它们之间不需要任何间距，我只是这样画的....此外，div应该是固定宽度。

替代文字 http://cowfarm.net/divAlign.png

Answer 1

是的，这是可能的：

<table>
    <tr>
        <td></td>
        <td rowspan='2'></td>
    </tr>
    <tr>
        <td></td>
    </tr>
    <tr>
        <td colspan='2'></td>
    </tr>
</table>

当然，我只是在开玩笑。

Answer 2

2 个左 DIV 和右 DIV 的组合高度不会相等。除非你指定这些，或者如果内容产生相同的高度......但这不应该是我认为的问题吗？

更新

<style type="text/css">
    #container {float:right;position:relative;}
    #left    {float:left;}
    #left_1  {float:left;}
    #left_2  {clear:left;float:left;}
    #right   {float:right;}
    #bottom  {float:left;clear:both;}
</style>

<div id="container">
    <div id="left">
        <div id="left_1">left 1</div>
        <div id="left_2">left 2</div>
    </div>

    <div id="right">right</div>

    <div id="bottom">bottom</div>
</div>