[ Поиск ] - [ Пользователи ] - [ Календарь ]
Полная Версия: разметка в сss
Stas
тут хтл
<div id="main-in1">
200x150
</div>
<div
id="main-in2">
200x150
</div>

тут стиль
#main-in1
{
margin-left:5px;
margin-top:5px;
width:200px;
height:150px;
background-color: #A9A9A9

}
#main-in2
{
margin-left:250px;
margin-top:0px;
width:200px;
height:150px;
background-color: #A9A9A9

}

все в главном стиле
#generl_content
{
width:1000px;
margin: 0 auto;
clear: both;
}

главный
<div id="generl_content">
<div
id="leftcontent">

</div>
<div
id="main">
<div
id="main-in1">
200x150
</div>
<div
id="main-in2">
200x150
</div>
</div>

все блок идут в низ а надо в одну линию
помогите есле можно



Спустя 27 минут, 2 секунды (15.08.2011 - 22:58) sebastjan написал(а):
Ну Ё-маЁ, уж столько раз в вёрстке это было.


<!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=utf-8">
<title>
xxxxx</title>
<style>

/* POCITAITE PRO float: */
.b1{
background-color: #00FF00;
height: 200px;
width: 200px;
float: left;
margin-right: 20px;
}
.b2{
background-color: #CC3300;
height: 200px;
width: 200px;
float: left;
margin-right: 20px;
}
.b3{
background-color: #0066FF;
float: left;
height: 200px;
width: 200px;
}
</style>
</head>
<body>

<div
class="b1"></div>
<div
class="b2"></div>
<div
class="b3"></div>

</body>
</html>



Спустя 53 секунды (15.08.2011 - 22:59) redreem написал(а):
float:left в помощь

Спустя 8 часов, 34 минуты, 59 секунд (16.08.2011 - 07:34) Stas написал(а):
это понятно а вот с отступом как быть
от class-1 до class-6
это в 2 строки по 3 элемента на горезонтальной линии

Спустя 20 минут, 12 секунд (16.08.2011 - 07:54) l@pteff написал(а):
Попробуй через display:inline:

<div id="main-in1" style="display:inline; margin-left:5px; margin-top:5px; width:200px; height:150px; background-color: #A9A9A9">
200x150
</div>

<div
id="main-in2" style="display:inline; margin-left:250px; margin-top:0px; width:200px; height:150px; background-color: #A9A9A9">
200x150
</div>

Спустя 3 часа, 40 минут, 54 секунды (16.08.2011 - 11:35) Stas написал(а):
а без
display:inline;

ни как надо чтоб прямоугольник был 200х150
и они стояли горизонтально в ряд по 3 штуки

Спустя 58 минут, 29 секунд (16.08.2011 - 12:33) redreem написал(а):
чтобы строго по 3 - обворачивайте каждые 3 дива внешним дивом.

Спустя 4 часа, 31 минута, 13 секунд (16.08.2011 - 17:05) Stas написал(а):
ну код огромный получтся

Спустя 1 час, 44 минуты (16.08.2011 - 18:49) redreem написал(а):
либо так либо таблицей.

Спустя 11 часов, 7 минут, 35 секунд (17.08.2011 - 05:56) Stas написал(а):
Ну по идеи у меня обвернуто все три одним дивом div “main”
Быстрый ответ:

 Графические смайлики |  Показывать подпись
Здесь расположена полная версия этой страницы.
Invision Power Board © 2001-2024 Invision Power Services, Inc.