У меня возникли проблемы с тех пор, как я изменил свою оболочку контейнера на автоматическое изменение размера экрана пользователя.
Я пытаюсь создать форму, содержащую данные, в которой есть основной столбец и несколько вложенных столбцов в строке..
Когда я пытаюсь выполнить любой тип float, когда я очищаю его, он очищает панели инструментов, которые у меня есть справа и слева от контейнера.
Я надеюсь, что вы можете видеть изчто я пытаюсь сделать с примером кода, который я сделал.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>demo</title>
<style type="text/css">
* {margin:0;padding:0;}
body {
background: #fff;
font-size:100%;
}
.wrapper {
min-width:500px;
margin:20px auto;
padding:10px;
overflow:hidden;/*contain inner floats*/
background:#77F;
}
ul {background:#ccc;margin:0;padding:0;display:block;}
li {list-style-type:none;display:inline;}
.lheader {width:215px;text-align:left;background:#FFF;}
</style>
</head>
<body>
<div class="wrapper">
<ul>
<li class="lheader">Left Side 1</li>
<li>item 1</li>
<li>item 2</li>
<li>item 3</li>
<li>item 4</li>
</ul><ul>
<li class="lheader">Left Side 2</li>
<li>item 1</li>
<li>item 2</li>
<li>item 3</li>
<li>item 4</li>
</ul><ul>
<li class="lheader">Left Side 3</li>
<li>item 1</li>
<li>item 2</li>
<li>item 3</li>
<li>item 4</li>
</ul>
</div>
</body>
</html>