Вопрос об обертке, когда содержащий плавающие отделения

Я хотел бы создать a, браузер, центрируемый, ограниченный, обертка, которая авторасширяется в высоте вокруг различных отделений. Чтобы использование плаваний контролировало отделения, обертка просто останавливается после первого отделения. Будьте добры, это может или не может быть правильным способом сделать это, но вот почему я здесь.

Вот простой пример.

<head>

<style type="text/css">
<!--
#wrapper {
height: 100%;
width: 800px;
border: 1px solid #000;
margin-right: auto;
margin-left: auto;
}
#header {
height: 100px;
width: 800px;
}
#column1 {
width: 300px;
height: 400px;
float: left;
}
#column2 {
height: 400px;
width: 300px;
float: left;
}
#navbox {
float: left;
width: 200px;
height: 400px;
}
-->
</style>

</head>

<body>

<div id="wrapper">

<div id="header">test header</div>
<div id="navbox">test navbox</div>
<div id="column1">test column1</div>
<div id="column2">test column2</div>

</div><!--Close_wrapper-->
</body>
</html>
5
задан SLaks 15 January 2010 в 16:30
поделиться

3 ответа

Вы можете добавить что-то вроде

<div id="wrapper">

<div id="header">test header</div>
<div id="navbox">test navbox</div>
<div id="column1">test column1</div>
<div id="column2">test column2</div>

<br style="clear:both" />

</div><!--Close_wrapper-->
6
ответ дан 18 December 2019 в 05:28
поделиться

Вам нужно добавить элемент с Очистить: оба после div s.

Демо

4
ответ дан 18 December 2019 в 05:28
поделиться

Ответ на вопросы, которые содержат float и wrap в одном предложении обычно составляет

overflow: auto

:)

Если вы хотите, чтобы ваша обертка автоматически расширялась в высоту, то должен сделать это.

22
ответ дан 18 December 2019 в 05:28
поделиться