CSS - div定位问题

Question

我有一个 wrapper 。在那个 wrapper 里面我有 3 个 div。我希望#contentOne 站在#contentTwo 之上，contentThree 站在这两者的右侧。我相信有人可以提供帮助。预先感谢您的答复。干杯。马克。 (这个定位的东西让我很烦....)

http://jsfiddle.net/Qmrpu/

我的 HTML:

<div id="wrapper">
    <div id="contentOne" class="content">contentOne</div>
    <div id="contentTwo" class="content">contentTwo</div>
    <div id="contentThree" class="content">contentThree</div>
</div>

我的 CSS:

#wrapper{
    width:430px;
    float:left;
    height:auto;
    border:2px solid blue;}

.content{
    border:1px solid black;
    background-color:yellow;
    width:200px;
    height:100px;}

#contentThree{
    height:130px;}

Answer 1

你能把它们放在 float 的列包装器中吗？

<div id="wrapper">
    <div id="column1" class="column">
        <div id="contentOne" class="content">contentOne</div>
        <div id="contentTwo" class="content">contentTwo</div>
    </div>
    <div id="column2" class="column">
        <div id="contentThree" class="content">contentThree</div>
    </div>
</div>

CSS:

.column {
   float: left;
}

http://jsfiddle.net/xbcxs/