0

代码:

<div class="container">
<div class="box box1">
    1
</div>
<div class="box box2">
    2
</div>
<div class="box box3">
    3
</div>
<div class="box box4">
    4
</div>
</div>

.container {
    width: 960px;
    height: 1000px;
}
.box {
    width: 470px;
    background: #333333;
}
.box1 {
    float: left;
    height: 498px;
        color: #ffffff;
    font-size: 30px;
    text-align: center;
}
.box2 {
    float: left;
    margin-left: 20px;
    height: 589px;
        color: #ffffff;
    font-size: 30px;
    text-align: center;
}
.box3 {
    float: left;
    height: 446px;
    margin-top: 20px;
        color: #ffffff;
    font-size: 30px;
    text-align: center;
}
.box4 {
    float: left;
    margin-left: 20px;
    height: 529px;
    margin-top: 20px;
    color: #ffffff;
    font-size: 30px;
    text-align: center;
}

小提琴:http: //jsfiddle.net/hrAWn/

如何使框#3向上移动,使其与框#1之间的距离为20px,而不使用负上边距?我可以使用负边距实现我想要的,但我不喜欢使用负边距,所以我想看看是否有一种方法可以在不使用负边距的情况下将其向上移动。关于如何完成它的任何想法还是我必须使用负顶?

4

1 回答 1

3

只需将框 #2 更改为 float:right。

于 2013-08-19T14:14:13.463 回答