ReSQL.ru
     
powered by simpleCommunicator - 2.0.61     © 2026 Programmizd 02
Мобильная версия    Контакт    Правила    FAQ    Помощь
Целевая тема:
Создать новую тему:
Автор:
Закрыть
Цитировать
Доб. в избранное | Игнор. тему | Прикреп. тему | Пометить прочит. / непрочит. | Фильтр
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / Верстка дивами в две колонки. Помогите!!!
16 сообщений из 41, страница 2 из 2
  2  все
Верстка дивами в две колонки. Помогите!!!
    #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
| Ответить | Цитировать | Написать  
16 сообщений из 41, страница 2 из 2
  2  все
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / Верстка дивами в две колонки. Помогите!!!
Найденые пользователи ...
Разблокировать пользователей ...
Читали тему (0):
Читали форум (0):
Пользователи онлайн (0):
Польз. соглашение   Полит. конфиден.  
NoSQL.ru       Кролег: Проекты, Новости, Чат       РЕД ФОРУМ       Фотоальбом: Участники, Встречи
Закрыть
start [/forum/topic.php?fid=22&msg=35378845&tid=1456327]:
 0ms
get settings:
 9ms
get forum list:
 12ms
check forum access:
 3ms
check topic access:
 3ms
track hit:
 185ms
get topic data:
 7ms
get forum data:
 2ms
get page messages:
 34ms
get tp. blocked users:
 1ms
others: 215ms
total:  471ms
созд. / загр.: 471ms
x
x
Закрыть


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