|
|
|
| есть
такой код:
<div id="border">
<div>
text<br />
text<br />
text<br />
text<br />
text<br />
</div>
<div>
text<br />
text<br />
text<br />
text<br />
text<br />
</div>
<div>
text<br />
text<br />
text<br />
text<br />
text<br />
</div>
</div>
|
такой код выводиться в блоке построчно
как сделать так чтобы дивы в диве выводились как колонки таблицы...
причем так что если колонка не помещается блоке она переноситься на следующую строку.
кол-во вложенных дивов неограничено | |
|
|
|
|
|
|
|
для: kaoz
(06.06.2006 в 10:06)
| |
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
<title>Untitled Document</title>
<style>
.cl{ border:1px solid red; display:block; float:left}
</style>
</head>
<body>
<div id="border">
<div class="cl">
text1<br />
text1<br />
text1<br />
text1<br />
text1<br />
</div>
<div class="cl">
text2<br />
text2<br />
text2<br />
text2<br />
text2<br />
</div>
<div class="cl">
text3<br />
text3<br />
text3<br />
text3<br />
text3<br />
</div>
</div>
</body>
</html>
|
| |
|
|
|
|
|
|
|
для: AlexSol
(06.06.2006 в 10:57)
| | сделал как вы посоветовали:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Добавить пользователя</title>
<style type="text/css">
<!--
input
{
position:absolute;
left:120px;
width:145px;
}
.submit
{
width:150px;
}
#message
{
background-color : #CCCCCC;
border-width : 1px;
border-color : #000000;
border-style : solid;
padding-top : 5px;
padding-bottom : 5px;
padding-left : 10px;
padding-right : 5px;
}
#border
{
background-color : #EEEEEE;
border-width : 1px;
border-color : #000000;
border-style : solid;
border-top : none;
padding-top : 10px;
padding-bottom : 10px;
padding-left : 10px;
padding-right : 10px;
}
#col_0, #col_1
{
border : 1px solid red;
display : block;
float : left
}
-->
</style></head>
<body>
<div id="message">
<b>Ё</b>
</div>
<div id="border">
<div id="col_0">
текст<br />
текст<br />
текст<br />
текст<br />
</div>
<div id="col_0">
текст<br />
текст<br />
текст<br />
текст<br />
</div>
</div>
<div id="border">
<div id="col_1">
текст<br />
текст<br />
</div>
<div id="col_1">
текст<br />
текст<br />
</div>
<div id="col_1">
текст<br />
текст<br />
</div>
<div id="col_1">
текст<br />
</div>
</div>
</body>
</html>
|
чето неработает... где может быть ошибка?
надо чтоб блок "border" растягивался вместе с текстом в этом блоке.
и еще такой вопрос, можно ли указать определенную ширину вложенного дива? | |
|
|
|
|
|
|
|
для: kaoz
(06.06.2006 в 11:24)
| |
<style type="text/css">
<!--
input {
position:absolute;
left:120px;
width:145px;
}
.submit {
width:150px;
}
#message {
background-color: #CCCCCC;
border: 1px solid #000000;
padding: 5px 10px 5px 5px;
}
#border {
border: 1px solid #000000;
background: #EEEEEE;
border-top: none;
padding: 10px;
display : block;
margin:0;
float: left;
width:47%;
}
#col_0, #col_1 {
border: 1px solid red;
display : block;
float: left
}
-->
</style>
|
эксперементируйте... | |
|
|
|
|
|
|
|
для: AlexSol
(06.06.2006 в 11:51)
| | пасибо... наконец-таки с float разобрался :) | |
|
|
|