css - 如何将 div 放入角落

Question

我有一个高度跨度为 2 行的 div。但我希望以下 div 适合左下角和右下角：

http://jsfiddle.net/netnet/NNH6V/ 在浏览之前，请将分割器向左拖动，您会看到checkbox2和“2222222222”可以完美地适合左下角和右下角。

我可以使用相对位置（.VerticalUp 类）。但问题是它会在下面留下一个空行，这是我不想要的。

任何想法？

Answer 1

如果您尝试浮动 Hematology div，则其中有两个导致冲突。如果你改变 .Hematology { float: right; }，这将使产前内容正确浮动...使一切都适合...

Answer 2

尝试浮动位置。ps-我是新来的。没有太多经验。:)

Answer 3

嘿，现在像这样更改您的代码，因为您的代码很难我已经创建了新代码，请检查它。并根据设计实施您的项目

CSS代码

.top, .bottom{
list-style:none;
    color:#fff;
}


.top li, .bottom li{
    display:inline-block;
    background:green;
    width:33%;
    vertical-align: top;
    border-top:solid 10px red;
}
p{
    display:inline-block;
    vertical-align: top;
}

.bottom {
position:absolute;
    left:0;
    right:0;
    bottom:0;
}

.bottom li:last-child{
float:right;
}

HTML 代码

<ul class="top">
        <li>
        <input type="checkbox">
            <p>first Check box</p>
        </li>
        <li>
        <input type="checkbox">
            <p>Second Check box</p>
        </li>
        <li>
            <p>finel box</p>
        </li>
    </ul>


<ul class="bottom">
        <li>
        <input type="checkbox">
            <p>first Check box</p>
        </li>
        <li>
            <p>finel box</p>
        </li>
    </ul>

现场演示 http://jsfiddle.net/fAkY5/