Два div наверху, один div внизу - PullRequest
Новая
       6

Два div наверху, один div внизу

0 голосов
/ 02 августа 2011

Это будет выглядеть так: 

#div1 #div2
  #div3

Я пытался установить #div1 и #div2 на float left, но некоторая часть #div3 оказалась на вершине. В чем здесь проблема?

Ответы [ 5 ]

2 голосов
/ 02 августа 2011

Это должно работать для вас: 

<!DOCTYPE HTML>
<html>
<head>
  <title>aaa</title>
<style>
div {
    border: 1px solid red;
}
#container {
    width: 211px;
}
.fl {
    float: left;
}

#bottom {
    margin-left: auto;
    margin-right: auto;
    width: 100px;
}
</style>
</head>

<body>
    <div id="container">
        <div class="fl">FLOAT LEFT 1</div>
        <div class="fl">FLOAT LEFT 2</div>
        <div style="clear:both;"></div>
        <div id="bottom">Bottom Div</div>
    </div>
</body>

</html>

Кстати, вы не можете сделать свой плавающий div 100%;в ширину.В этом случае первый DIV сдвинет второй плавающий элемент div вниз, что приведет к 3 элементам div на вершине друг друга.

2 голосов
/ 02 августа 2011 
<div id="one"></div><div id="two"></div>
<div class="clear"></div>
<div id="three"></div>


<style>
#one {
float:left
}

#two {
float:left
}

.clear {
clear:both;

}


</style>
1 голос
/ 02 августа 2011

#div3 должно иметь clear:both.

0 голосов
/ 02 августа 2011

Сделайте width:100%; для div1 и div2, понял ли я вопрос.Кроме того, если это так.

0 голосов
/ 02 августа 2011

См. Это решение: http://jsfiddle.net/ZnZRs/1/

Удачи:)

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...