ReSQL.ru
     
powered by simpleCommunicator - 2.0.61     © 2026 Programmizd 02
Мобильная версия    Контакт    Правила    FAQ    Помощь
Целевая тема:
Создать новую тему:
Автор:
Закрыть
Цитировать
Доб. в избранное | Игнор. тему | Прикреп. тему | Пометить прочит. / непрочит. | Фильтр
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / Верстка дивами в две колонки. Помогите!!!
41 сообщений из 41, показаны все 2 страниц
  все  
Верстка дивами в две колонки. Помогите!!!
    #35368539
Necronominicon
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Necronominicon
Гость
Мужики, помогите!!! Нужно сверстать дивами две колонки. Но есть одна трудность: первая колонка должна быть резиновой, а у второй фиксированный размер. Все примеры, что я перелопатил предполагают верстку только либо процентами, либо фиксажом. Если кто знает как это сделать, то помогите!!!
...
Рейтинг: 0 / 0
11.06.2008, 08:56
| Ответить | Цитировать | Написать  
Верстка дивами в две колонки. Помогите!!!
    #35368587
ShSerge
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
ShSerge
Участник
Почему "мужики". На форуме на эту тему как раз лучше всех illion отвечает, которая не мужик.
...
Рейтинг: 0 / 0
11.06.2008, 09:23
| Ответить | Цитировать | Написать  
Верстка дивами в две колонки. Помогите!!!
    #35368595
Necronominicon
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Necronominicon
Гость
ShSergeПочему "мужики". На форуме на эту тему как раз лучше всех illion отвечает, которая не мужик.
Я только вчера сюда попал, поэтому и не знаю никого тут...
...
Рейтинг: 0 / 0
11.06.2008, 09:24
| Ответить | Цитировать | Написать  
Верстка дивами в две колонки. Помогите!!!
    #35368695
Фотография krvsa
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
krvsa
Участник
Necronominiconпервая колонка должна быть резиновой, а у второй фиксированный размер
Резиновой куда? Картинку покажи как нужно сделать... Вся верстка начинается "с картинки в твоем букваре" (с)
...
Рейтинг: 0 / 0
11.06.2008, 09:59
| Ответить | Цитировать | Написать  
Верстка дивами в две колонки. Помогите!!!
    #35368706
Necronominicon
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Necronominicon
Гость
krvsa Necronominiconпервая колонка должна быть резиновой, а у второй фиксированный размер
Резиновой куда? Картинку покажи как нужно сделать... Вся верстка начинается "с картинки в твоем букваре" (с)
Прикрепляю файл. Шаблон готов, но правда фиксированной ширины. Остался только сабж...
...
Рейтинг: 0 / 0
11.06.2008, 10:04
| Ответить | Цитировать | Написать  
Верстка дивами в две колонки. Помогите!!!
    #35368708
Фотография illion
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
illion
Участник
ShSergeНа форуме на эту тему как раз лучше всех illion отвечает
злыдень ты, теперь мне придется че-то отвечать, а то нехорошо получается :-))).

В общем сделать можно абсолютно спозиционированными дивами:
Код: plaintext
1.
2.
3.
4.
5.
<style>
.left {position:absolute; margin-right:210px; width:expression(document.body.clientWidth- 210 +'px'); background:yellow;}
.right {position:absolute; width:200px; right: 0 ; background:green; }
</style>
<div class="left">left</div>
<div class="right">right</div>
противный ИЕ6 не захотел устанавливать margin-right, поэтому для него персональное вычисление width.
...
Рейтинг: 0 / 0
11.06.2008, 10:04
| Ответить | Цитировать | Написать  
Верстка дивами в две колонки. Помогите!!!
    #35368723
Necronominicon
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Necronominicon
Гость
illion, спасибо огромное!!! Сейчас попробую... Но заранее целую в алые губки. Спасибо!!!
...
Рейтинг: 0 / 0
11.06.2008, 10:08
| Ответить | Цитировать | Написать  
Верстка дивами в две колонки. Помогите!!!
    #35368847
Фотография krvsa
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
krvsa
Участник
illion , при таком варианте дивы налазят друг на друга при уменьшении ширины окна...
----------
Cache for Windows (x86-32) 2007.1.3 (Build 607) Wed Oct 17 2007 02:12:09 EDT
...
Рейтинг: 0 / 0
11.06.2008, 10:47
| Ответить | Цитировать | Написать  
Верстка дивами в две колонки. Помогите!!!
    #35368907
Фотография illion
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
illion
Участник
конечно налезут, если уменьшить до определенных размеров. За этим программисту и нужна голова - чтоб думать. Посмотреть на основу, а потом привести ее к рабочему виду. Вставить в страницу див-распорку с min-width, например. Думаю она поможет.
...
Рейтинг: 0 / 0
11.06.2008, 11:04
| Ответить | Цитировать | Написать  
Верстка дивами в две колонки. Помогите!!!
    #35368927
Vint_x
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Vint_x
Гость
Ну можно и проще сделать:
Код: plaintext
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
 <style type="text/css">
        #lDiv
        {        	
        	background: #FFC;
        	height:300px;        	
        	margin-right: 220px;
        }
        #rDiv
        {
        	
        	width: 210px;
        	height:300px;  
        	float:right;        	      	
        	background: #CCC;
        }
    </style>

<div id="rDiv"></div>
<div id="lDiv"></div>
...
Рейтинг: 0 / 0
11.06.2008, 11:08
| Ответить | Цитировать | Написать  
Верстка дивами в две колонки. Помогите!!!
    #35368971
Фотография krvsa
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
krvsa
Участник
Например в ИЕ прекрасно работает вот этот вариант...

Код: plaintext
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
25.
26.
27.
28.
29.
30.
31.
32.
33.
34.
35.
36.
37.
38.
39.
40.
41.
42.
43.
44.
45.
46.
47.
48.
49.
50.
51.
52.
53.
54.
55.
56.
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=windows-1251" />
<style type='text/css'>
* {
	margin: 0px;
	padding: 0px;
}
html {
	width:  100 %;
}
body {
	width:  100 %;
	height:  100 %;
}
div {
}
#container {
	float: left;
	width:  100 %;
	height:  100 %;
}
#left {
	float: left;
	clear: right;
	height:  100 %;
	background-color: aqua;
}
#tab {
	float: left;
	clear: right;
	width: 200px;
	height:  100 %;
	background-color: yellow;
}
#right {
	float: left;
	margin-left: -200px;
	margin-right: auto;
	width: 200px;
	height: 400px;
	overflow: hidden;
	background-color: red;
}
</style>
</head>
<body>
<div id='container'>
	<div id='left'>Куча текста
	</div>
	<div id='tab'>Tab
	</div>
</div>
	<div id='right'>Право
	</div>
</body>
</html>
----------
Cache for Windows (x86-32) 2007.1.3 (Build 607) Wed Oct 17 2007 02:12:09 EDT
...
Рейтинг: 0 / 0
11.06.2008, 11:24
| Ответить | Цитировать | Написать  
Верстка дивами в две колонки. Помогите!!!
    #35369035
Vint_x
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Vint_x
Гость
height: 100%; работает только в ИЕ.
...
Рейтинг: 0 / 0
11.06.2008, 11:43
| Ответить | Цитировать | Написать  
Верстка дивами в две колонки. Помогите!!!
    #35369117
ShSerge
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
ShSerge
Участник
krvsa
Ага. Точно надо сделать форум, тынц - и всё видно.
...
Рейтинг: 0 / 0
11.06.2008, 12:01
| Ответить | Цитировать | Написать  
Верстка дивами в две колонки. Помогите!!!
    #35369124
Фотография krvsa
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
krvsa
Участник
Vint_x , мне понравился твой пример. Но в твоем варианте при уменьшении ширины окна правая часть залазит на левую...

В моем примере в Опере "упрыгивает" див "таб"... Вот как бы его "заставть" стоять на месте?
----------
Cache for Windows (x86-32) 2007.1.3 (Build 607) Wed Oct 17 2007 02:12:09 EDT
...
Рейтинг: 0 / 0
11.06.2008, 12:02
| Ответить | Цитировать | Написать  
Верстка дивами в две колонки. Помогите!!!
    #35369229
Vint_x
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Vint_x
Гость
К сожалению IE не знает min-width.
Но, более менее нормально себя ведёт такой способ..
Код: plaintext
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
25.
26.
27.
28.
29.
<!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>
    <title>Untitled Page</title>
    <style type="text/css">
        #lDiv
        {        	
        	background: #FFC;
        	height:500px;        	
        	margin-right: 220px;
        	min-width: 300px;
        }
        #rDiv
        {
        	position:absolute;
        	right:0px;
        	width: 210px;
        	height:300px; 
        	background: #CCC;
        	
        }
    </style>
</head>
<body>
<div id="rDiv">Правая</div>
<div id="lDiv">Левая</div>

</body>
</html>
...
Рейтинг: 0 / 0
11.06.2008, 12:23
| Ответить | Цитировать | Написать  
Верстка дивами в две колонки. Помогите!!!
    #35369274
Фотография krvsa
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
krvsa
Участник
Прокрутка горизонтальная не появляется...
----------
Cache for Windows (x86-32) 2007.1.3 (Build 607) Wed Oct 17 2007 02:12:09 EDT
...
Рейтинг: 0 / 0
11.06.2008, 12:34
| Ответить | Цитировать | Написать  
Верстка дивами в две колонки. Помогите!!!
    #35369459
Фотография illion
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
illion
Участник
Vint_xК сожалению IE не знает min-width.

поражаете. Для ИЕ придумана куча способов имитации этого свойства. Начиная от заумных и заканчивая тупо вставкой в страницу дива с заданной шириной.
...
Рейтинг: 0 / 0
11.06.2008, 13:22
| Ответить | Цитировать | Написать  
Верстка дивами в две колонки. Помогите!!!
    #35369919
Necronominicon
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Necronominicon
Гость
Спасибо всем кто отписался в данной теме. Не ожидал, что мне так быстро и качественно могут. Пересмотрел все варианты и остановился на примере Vint_x , за что ему моя личная благодарность.
...
Рейтинг: 0 / 0
11.06.2008, 15:24
| Ответить | Цитировать | Написать  
Верстка дивами в две колонки. Помогите!!!
    #35374960
зы
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
зы
Участник
NecronominiconНо заранее целую в алые губки.
NecronominiconНе ожида л
ахтунг блин :-O

вообще нужна резиновая верстка - таблицы и в путь, нафиг эти дивы
...
Рейтинг: 0 / 0
16.06.2008, 16:20
| Ответить | Цитировать | Написать  
Верстка дивами в две колонки. Помогите!!!
    #35375616
ShSerge
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
ShSerge
Участник
зы...таблицы и в путь, нафиг эти дивы...
Да. Правильно. Хотелось написать чего-то умное по поводу тысячного поста. Но, не могу не согласиться, что таблицы (которые ещё фиг знает когда были) - вариант лучший.
...
Рейтинг: 0 / 0
16.06.2008, 21:11
| Ответить | Цитировать | Написать  
Верстка дивами в две колонки. Помогите!!!
    #35377792
Vint_x
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Vint_x
Гость
Табличная вёрстка очень громоздкая и уже можно сказать "прошлый век".
...
Рейтинг: 0 / 0
17.06.2008, 16:31
| Ответить | Цитировать | Написать  
Верстка дивами в две колонки. Помогите!!!
    #35378001
зы
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
зы
Участник
да ну?
сделай мне такую хрень на дивах:


|----- резиновая колонка -----|--100px--|--50px--|


это одна строчка. Таких может быть много. По ширине строка занимает 100% от контейнера.
...
Рейтинг: 0 / 0
17.06.2008, 17:21
| Ответить | Цитировать | Написать  
Верстка дивами в две колонки. Помогите!!!
    #35378455
ShSerge
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
ShSerge
Участник
Vint_xТабличная вёрстка очень громоздкая и уже можно сказать "прошлый век".
Двойка. Зато твёрдая.
...
Рейтинг: 0 / 0
17.06.2008, 20:33
| Ответить | Цитировать | Написать  
Верстка дивами в две колонки. Помогите!!!
    #35378631
Vint_x
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Vint_x
Гость
Руки просто должны рости откуда следует и всё можно дивами реализовать. Дело в том, что при вёртске дивами появляется такая проблема, чем руки кривее, тем почему то сложнее что то реализовать. ShSerge так что для начала сходи к пластическому хирургу, а потом оценки ставь.

Если есть сомнения, полистай работы, сделанные нормальными руками:
www.csszengarden.com
...
Рейтинг: 0 / 0
17.06.2008, 23:11
| Ответить | Цитировать | Написать  
Верстка дивами в две колонки. Помогите!!!
    #35378755
Фотография illion
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
illion
Участник
Vint_xРуки просто должны рости откуда следует и всё можно дивами реализовать. Дело в том, что при вёртске дивами появляется такая проблема, чем руки кривее, тем почему то сложнее что то реализовать. ShSerge так что для начала сходи к пластическому хирургу, а потом оценки ставь.

про зависимость сложности реализации от кривизны рук соглашусь. Но утверждение про "всё можно дивами реализовать" просто глупое. Если у Вас не хватает фантазии придумать то, что нельзя реализовать дивами, то это еще не значит, что у всех такое скудное воображение.

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

Код: plaintext
1.
2.
3.
4.
5.
6.
7.
8.
<table height="100%" width="100%" border="1">
<tr height="50"><td colspan="3">header</td></tr>
<tr>
	<td width="200"> 1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 1 <br></td>
	<td> 1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 1 <br></td>
	<td width="20%"> 1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 1 <br></td>
</tr>
<tr height="35"><td colspan="3">footer</td></tr>
</table>
...
Рейтинг: 0 / 0
18.06.2008, 03:13
| Ответить | Цитировать | Написать  
Верстка дивами в две колонки. Помогите!!!
    #35378832
Фотография krvsa
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
krvsa
Участник
зысделай мне такую хрень на дивах:

|----- резиновая колонка -----|--100px--|--50px--|
Для этого сойдет немного усовершенствованый пример от Vint_x ...

Но я сам за разумное сочетание верстки.
...
Рейтинг: 0 / 0
18.06.2008, 08:07
| Ответить | Цитировать | Написать  
Верстка дивами в две колонки. Помогите!!!
    #35378845
Фотография krvsa
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
krvsa
Участник
illionа Вы мне - полный аналог на дивах
До "полного" мой пример конечно не дотягивает... Но какой есть...

Код: plaintext
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
25.
26.
27.
28.
29.
30.
31.
32.
33.
34.
35.
36.
37.
38.
39.
40.
41.
42.
43.
44.
45.
46.
47.
48.
49.
50.
51.
52.
53.
54.
55.
56.
57.
58.
59.
60.
61.
62.
63.
64.
<!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=windows-1251" />
<style type='text/css'>
* {
	margin: 0px;
	padding: 0px;
}
body {
	width:  100 %;
	height:  100 %;
}
#head {
	height: 50px;
	border: 1px solid;
}
#container {
}
#left {
	width: 200px;
	float: left;
	border-left: 1px solid;
	border-right: 1px solid;
}
#content {
	float: left;
}
#center {
	float: left;
}
#right {
	width:  20 %;
	float: right;
	border-left: 1px solid;
	border-right: 1px solid;
}
#footer {
	height: 35px;
	border: 1px solid;
}
</style>
</head>
<body>
<div id='head'>
	<p>Head</p>
</div>
<div id='container'>
	<div id='left'>
		 1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 1 <br>
	</div>
	<div id='content'>
		<div id='center'>
			 1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 1 <br>
		</div>
		<div id='right'>
			 1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 1 <br>
		</div>
	</div>
</div>
<div id='footer'>
	<p>Footer</p>
</div>
</body>
</html>
...
Рейтинг: 0 / 0
18.06.2008, 08:35
| Ответить | Цитировать | Написать  
Верстка дивами в две колонки. Помогите!!!
    #35378849
Фотография krvsa
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
krvsa
Участник
Даже вот так вроде смотрится аналогично...

Код: plaintext
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
<div id='head'>
	<p>Head</p>
</div>
<div id='container'>
	<div id='left'>
		 1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 1 <br>
	</div>
	<div id='center'>
		 1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 1 <br>
	</div>
	<div id='right'>
		 1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 1 <br>
	</div>
</div>
<div id='footer'>
	<p>Footer</p>
</div>
----------
Cache for Windows (x86-32) 2007.1.3 (Build 607) Wed Oct 17 2007 02:12:09 EDT
...
Рейтинг: 0 / 0
18.06.2008, 08:39
| Ответить | Цитировать | Написать  
Верстка дивами в две колонки. Помогите!!!
    #35378903
Vint_x
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Vint_x
Гость
illion, давайте во первых перестанем выпендриваться кто больше знает и кого больше фантазии.. Во-вторых, дивы никогда не заменят таблиц, как и таблицы дивы.
В данной истории 2 правды. Так что, кто как привык, тот так и верстает. Реализовать на дивах можно что угодно, и тут дело не в фантазии, а в умении пользоваться html + СSS. если этого умения нет, то табличная вёрстка - это самый оптимальный вариант.
...
Рейтинг: 0 / 0
18.06.2008, 09:20
| Ответить | Цитировать | Написать  
Верстка дивами в две колонки. Помогите!!!
    #35379042
Фотография illion
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
illion
Участник
Vint_xillion, давайте во первых перестанем выпендриваться кто больше знает и кого больше фантазии.. Во-вторых, дивы никогда не заменят таблиц, как и таблицы дивы.
В данной истории 2 правды. Так что, кто как привык, тот так и верстает. Реализовать на дивах можно что угодно, и тут дело не в фантазии, а в умении пользоваться html + СSS. если этого умения нет, то табличная вёрстка - это самый оптимальный вариант.
я ни в коем случае не собираюсь с Вами ничем меряться - мне это попросту не интересно. Мне непонятна эта упертость рогом в "реализовать на дивах можно что угодно". Я утверждаю, что "реализовать на дивах можно что угодно с учетом особенностей дивной верстки". Под особенностями я имею в виду например то, что высота дива должна определяться его содержимым. Если Вы по-прежнему со мной не согласны, то я настоятельно прошу привести аналог той табличной разметки, ибо тема подобная на форуме возникала уже не раз и не два.
...
Рейтинг: 0 / 0
18.06.2008, 10:16
| Ответить | Цитировать | Написать  
Верстка дивами в две колонки. Помогите!!!
    #35379074
Vint_x
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Vint_x
Гость
illion, реализовать ваш пример средствами div не сложно, другое дело, если основная задача поиграться с растяжением и сжатием как с гармошкой, то дивы и таблицы будут себя вести по разному, таблица поведёт себя как таблица, а блоки как блоки, на то они так и называются.
Так что вывод один:
нельзя кидаться только на дивы или на таблицы... смешанная вёртка рулит. Ну а не за горами css3, в которой обещают решить эти недостатки.
...
Рейтинг: 0 / 0
18.06.2008, 10:26
| Ответить | Цитировать | Написать  
Верстка дивами в две колонки. Помогите!!!
    #35379103
Vint_x
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Vint_x
Гость
Очень хорошее высказывание:

авторЕдинственным весомым аргументом ПРОТИВ использования таблиц является семантика. Всё остальное определяется в конкретной ситуации. У таблиц много преимуществ перед div-ами, как и у div-ов перед таблицами. Если вы хотите верстать ПРАВИЛЬНО, то будьте добры без таблиц, так как это противоречит спецификации. Тем не менее практически это ничего не даст
Div-ами надо по крайней мере уметь верстать. За блочной версткой будущее. Но не настоящее.
На котором я думаю и следует закончить данный спор.
...
Рейтинг: 0 / 0
18.06.2008, 10:35
| Ответить | Цитировать | Написать  
Верстка дивами в две колонки. Помогите!!!
    #35379316
Фотография illion
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
illion
Участник
Vint_xillion, реализовать ваш пример средствами div не сложно
блиннн, ну так реализуй его наконец-то, третий раз прошу! С соблюдением условия высоты.

Насчет css3 - хотелось бы конечно. Как и html5. Но у меня такое чувство, что я состарюсь быстрее, чем этим начнут реально пользоваться. Некоторые пользователи от ИЕ5 все никак оторваться не могут :-(.
...
Рейтинг: 0 / 0
18.06.2008, 11:21
| Ответить | Цитировать | Написать  
Верстка дивами в две колонки. Помогите!!!
    #35379378
Vint_x
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Vint_x
Гость
Хорошо. вот один из возможных вариантов.
Код: plaintext
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
25.
26.
27.
28.
29.
30.
31.
32.
33.
34.
35.
36.
37.
38.
39.
40.
41.
42.
43.
44.
45.
46.
47.
48.
49.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>Untitled Page</title>
    <style type="text/css" media="all">
     body {
     	margin: 0px;
     	padding:10px; 
     }  
    #header {
    	padding: 30px 5px 30px 5px; 
    	border: 1px solid #CCC;   	
    }      
    #left {
    	position: absolute;
        width: 150px;  
        left: 10px; 
        border: 1px solid #CCC; 
    }
    #center {    
    	margin: 0px  20 % 0px 151px;
    	border: solid #CCC;   
    	border-width: 1px 0px 1px 1px;
    }    
    #right {
    	width: 20 %;
    	position: absolute;
        right: 10px;
        border: 1px solid #CCC;  
    }
    </style>
</head>
<body>
    <div id="header">
        header</div>
    <div id="left">
         1 <br /> 1 <br /> 1 <br /> 1 <br /> 1 <br /> 1 <br /> 1 <br /> 1 <br /> 1 <br /> 1 <br /> 1 <br /> 1 <br />
    </div>
    <div id="right">
        1 <br /> 1 <br /> 1 <br /> 1 <br /> 1 <br /> 1 <br /> 1 <br /> 1 <br /> 1 <br /> 1 <br /> 1 <br /> 1 <br />
    </div>
    <div id="center">
         1 <br /> 1 <br /> 1 <br /> 1 <br /> 1 <br /> 1 <br /> 1 <br /> 1 <br /> 1 <br /> 1 <br /> 1 <br /> 1 <br />        
    </div>        
    <div id="footer">
        footer
    </div>
</body>
</html>
...
Рейтинг: 0 / 0
18.06.2008, 11:33
| Ответить | Цитировать | Написать  
Верстка дивами в две колонки. Помогите!!!
    #35379397
ShSerge
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
ShSerge
Участник
...
Рейтинг: 0 / 0
18.06.2008, 11:37
| Ответить | Цитировать | Написать  
Верстка дивами в две колонки. Помогите!!!
    #35379623
Фотография illion
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
illion
Участник
Vint_xХорошо. вот один из возможных вариантов.

:-))). Вижу что фразу о соблюдении условия высоты Вы решили проигнорировать, хотя это единственное, что меня интересовало.

Ладно, сдаюсь. Больше обсуждать действительно нечего. Юзаем смешанную верстку.
...
Рейтинг: 0 / 0
18.06.2008, 12:16
| Ответить | Цитировать | Написать  
Верстка дивами в две колонки. Помогите!!!
    #35380226
зы
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
зы
Участник
Vint_x:
все бы хорошо, если бы набор глюков, связанных с дивами (в т.ч. и кроссбраузерных) не вынуждал послать эти дивы куда подальше во многих случаях. Взяв на себя смелось, адаптировал твой пример под то, что я все-таки от тебя, пока не вмешались другие со своими тривиальными случаями. Уже вижу, как ты начинаешь искать под столом бубен, чтобы победить видные невооруженным глазом глюки. А ведь все могло бы быть намного проще :)
Код: plaintext
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
25.
26.
27.
28.
29.
30.
31.
32.
33.
34.
35.
36.
37.
38.
39.
40.
41.
42.
43.
44.
45.
46.
47.
48.
49.
50.
51.
52.
53.
54.
55.
56.
57.
58.
59.
60.
61.
62.
63.
64.
65.
66.
67.
68.
69.
70.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>Untitled Page</title>
    <style type="text/css" media="all">
     body {
     	margin: 0px;
     	padding:10px; 
     }  
    #header {
    	padding: 30px 5px 30px 5px; 
    	border: 1px solid #CCC;   	
    }      
    #left {
    	position: absolute;
        width: 150px;  
        left: 10px; 
        border: 1px solid #CCC; 
    }
    #center {    
    	margin: 0px  20 % 0px 151px;
    	border: solid #CCC;   
    	border-width: 1px 0px 1px 1px;
		white-space: nowrap;
		overflow: hidden;
		text-overflow: ellipsis;
    }    
    #right {
    	width: 20 %;
    	position: absolute;
        right: 10px;
        border: 1px solid #CCC;  
    }
    </style>
</head>
<body>
<div style="width: 50%; position: absolute; top: 20px; left: 20px;">
    <div id="header">
        header</div>
    <div id="left">
         1 <br />
    </div>
    <div id="right">
         1 <br />
    </div>
    <div id="center">
         113  123h kj12h3  018273   918273   9817239   87129837192837   982173   kajsdhf kjhas fdkjhsadkjfhaskjfh kjahdf  asdfjkh<br />
    </div>
    <div id="left">
         1 <br />
    </div>
    <div id="right">
         1 <br />
    </div>
    <div id="center">
         1 <br />
    </div>
    <div id="left">
         1 <br />
    </div>
    <div id="right">
         1 <br />
    </div>
    <div id="center">
         1 <br />
    </div>    
    <div id="footer">
        footer
    </div>
</div>
</body>
...
Рейтинг: 0 / 0
18.06.2008, 14:32
| Ответить | Цитировать | Написать  
Верстка дивами в две колонки. Помогите!!!
    #35380583
maXmo
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
maXmo
Участник
Vint_xТабличная вёрстка очень громоздкая и уже можно сказать "прошлый век".равно как и осёл, а я могу верстку на дивах сделать во сколько угодно раз более громоздкой, чем на таблицах.
...
Рейтинг: 0 / 0
18.06.2008, 15:51
| Ответить | Цитировать | Написать  
Верстка дивами в две колонки. Помогите!!!
    #35381034
maXmo
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
maXmo
Участник
угадайте, на чём это сверстано?
...
Рейтинг: 0 / 0
18.06.2008, 18:00
| Ответить | Цитировать | Написать  
Верстка дивами в две колонки. Помогите!!!
    #35381332
ShSerge
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
ShSerge
Участник
Хватит ругаццо. Всё уже и так понятно всем.
...
Рейтинг: 0 / 0
18.06.2008, 20:26
| Ответить | Цитировать | Написать  
Верстка дивами в две колонки. Помогите!!!
    #35381364
Logo
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Logo
Гость
maXmo очевидно, на дивах.
З.Ыю Зашел и убедился.
...
Рейтинг: 0 / 0
18.06.2008, 21:15
| Ответить | Цитировать | Написать  
41 сообщений из 41, показаны все 2 страниц
  все  
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / Верстка дивами в две колонки. Помогите!!!
Найденые пользователи ...
Разблокировать пользователей ...
Читали тему (0):
Читали форум (0):
Пользователи онлайн (0):
Польз. соглашение   Полит. конфиден.  
NoSQL.ru       Кролег: Проекты, Новости, Чат       РЕД ФОРУМ       Фотоальбом: Участники, Встречи
Закрыть
start [/forum/topic.php?all=1&fid=22&tid=1456327]:
 0ms
get settings:
 7ms
get forum list:
 15ms
check forum access:
 3ms
check topic access:
 3ms
track hit:
 189ms
get topic data:
 12ms
get forum data:
 3ms
get page messages:
 94ms
get tp. blocked users:
 1ms
others: 207ms
total:  534ms
созд. / загр.: 534ms
x
x
Закрыть


Просмотр
0 / 0
Close
Debug Console [Select Text]