ну никак не хочет отображаться нормально

boy_from_Mexico · November 19, 2009

Здравствуйте

я запарился с этим макетом

вот код:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"

"http://www.w3.org/TR/html4/strict.dtd">

<head>

<title>Актау Камаз Сервис</title>

</head>

<td colspan=2 style="background:white;height:168px;"> Это шапка</td>

</tr>

<td id="menu" style="background:blue;">Здесь меню</td>

<td style="background:yellow;">Здесь контент</td>

</tr>

<td colspan=2>ну а это футер</td>

</tr

</table>

</div>

</body>

</html>

css:

#header {display:block;height:168px;}

#footer {height:50px;}

#menu {width:200px;}

почему шапка не принимает высоту 168px, а, судя по субъективной оценке, становиться в высоту где-то 500 пикс, а меню с контентом не расягиваются на оставшую высоту?

вот как он отображается у меня http://narod.ru/disk/15210962000/AKS.JPG.html

Edited November 19, 2009 by boy_from_Mexico

psywalker · November 19, 2009

1) Код нужно вставлять в спец.теги, предназначенные для этого

2) Ты поставил таблице высоту 800пк, возможно из-за этого косяк

3) Все стили выноси в CSS, и делай код красивее

mishka · November 19, 2009

стили пиши не на <tr>, а на <td>

Edited November 19, 2009 by mishka2

boy_from_Mexico · November 20, 2009

высоту я затал как раз в <tr>

по идее резиновой должна была стать часть которой не задана высота

ну это я исправил

теперь другой вопрос

когда я в верхнюю ячейку вставляю картинку и выравниваю её по центру

почему-то левая колонна, которая предназначена для меню, становиться шире раза в 2.С чего это?

Justnewone · November 20, 2009

высоту я затал как раз в <tr>
по идее резиновой должна была стать часть которой не задана высота
ну это я исправил
теперь другой вопрос
когда я в верхнюю ячейку вставляю картинку и выравниваю её по центру
почему-то левая колонна, которая предназначена для меню, становиться шире раза в 2.С чего это?

А зачем как раз на TR, какие были мотивы?

И правду, а давайте погадаем, почему же она стала в 2 раза шире???

В таблице у Вас будет неизменяемый контент по высоте, который всегда будет помещаться в 800px?

boy_from_Mexico · November 20, 2009

нет.я задал высоту 800 пикс, чтобы было удобно редактировать "каркас" сайта

а на TR задал просто потому,что мне нужна быля ячейка высотой 168пикс

mishka · November 20, 2009

Ну вот зачем ты сюда пишешь, вопросы задаешь? Ты же сам все знаешь.

Ему говорят на td стили пиши, а он понимаете ли свои взгляды на этот счет имеет.

Какой смысл чтото тебе подсказывать?

Edited November 20, 2009 by mishka2

psywalker · November 20, 2009

Ну вот зачем ты сюда пишешь, вопросы задаешь? Ты же сам все знаешь.
Ему говорят на td стили пиши, а он понимаете ли свои взгляды на этот счет имеет.
Какой смысл чтото тебе подсказывать?

Вот таких людей и я не понимал никогда, спрашивается, зачем приходил за помощью?

mishka · November 20, 2009

а display:block для tr это что еще за изврат?

Edited November 20, 2009 by mishka2

boy_from_Mexico · November 20, 2009

а.тфу блин..я просто перепутал.я переделал на td

все исправил.

Но вот появилась проблема с колонной,которая для меню.Она сильно увеличивается в ширине,хотя я ясно задал 200px

Justnewone · November 20, 2009

а.тфу блин..я просто перепутал.я переделал на td
все исправил.
Но вот появилась проблема с колонной,которая для меню.Она сильно увеличивается в ширине,хотя я ясно задал 200px

первого раза не хватило?

Чел, тебе на наше время наплевать???

Ссылку, в крайнем случае код полностью, скрин и ваще максимально подробно!

UPD.

Трехкопеешную херь мы делаем больше часа только потому, что ты не можешь нормально описать проблему.

Edited November 20, 2009 by Justnewone

psywalker · November 20, 2009

ТС , тебе надо было топик назвать "Ну никак я не хочу, чтобы отображалось нормально"

boy_from_Mexico · November 21, 2009

Извините,просто был сильно разозлен,поэтому писал не в самом адекватном состоянии

Привожу код таблицы

все браузеры,кроме IE7 понимают страницу как нужно

я перепробовал несколько doctyp'ов, но не помогло

  <body>
  <table height=550 width=100%  border=1 cellspacing=0 cellpadding=0 style="margin: 0 auto;">
	<tr>
	<td  colspan=2 style="background:red;height:150px;" align=center>
	<div style="width:500px;height:150px;background:green;">Логотип</div>
	</td>
	</tr>

	<tr>
	<td Style="width:200px;background:pink;">Здесь Меню</td>
	<td style="background:yellow;">Здесь Контент</td>
	</tr>

	<tr >
	<td colspan=2 style="background:blue;height:100px;">Футер</td>
	</tr	

  </table>
  </body>

вот как оно выглядит в браузере IE7

вот как страница выглядит в FF и Opera,собственно чего я и добиваюсь

почему получается так?

я пробовал выравнивать логотив и с помощью marin:o auto, но эффект тот же

Edited November 21, 2009 by boy_from_Mexico

Justnewone · November 21, 2009

Однако... !!!

Давненько не верстал таблицей )))

Че я делаю не так?

во всех IE что-то не то. В Восьмом левая колонка не хочет принимать указанную ширину, а 6 и 7 ваще биллиберду показывают, пока их в квирксмод не переведешь!!!

psywalker · November 21, 2009

ээхх, молодёж всё таблицами тешется

<!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>2col</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
html, body{
	width:100%;
	height:100%;
	margin:0;
	padding:0;
	background:#FFF;
	}

body{
	font-family:Tahoma;
	font-size:0.75em;
	}

.main{
	width:100%;
	height:100%;
	margin:0 auto;
	border-collapse:collapse;
	}

.main td{
	vertical-align:top;
	}


* html .main{
	height:100%;
	}

.header{
	height:150px;
	background:#F00;
	}

	.logo{
		width:500px;
		height:150px;
		margin:0 auto;
		background:#00F;
		}

.left-bar{
	width:200px;
	background:#FCC;
	height: 100px;
		height: 100%;
	height: expression(this.offsetParent.offsetParent.offsetHeight - 260);

	}

.content{
	background:#FF0;
	width: 100%;


	}

.footer{
	height:100px;
	background:#00F;
	}

</style>
</head>
<body>
<table class="main">
	<tr>
		<td colspan="2" class="header">
			<div class="logo">Логотип</div>

		</td>
	</tr>
	<tr>
		<td class="left-bar"><div style="width: 200px;">Left bargfdgdg dfgd ddg</div></td>
		<td class="content">Content</td>
	</tr>
	<tr>
		<td colspan="2" class="footer">Footer</td>

	</tr>
</table>
</body>
</html>

Edited November 21, 2009 by psywalker

Justnewone · November 21, 2009

Чета в ФФ терь не работает

s0rr0w · November 21, 2009

В ИЕ есть бага. Если первая строка содержит colspan, то во второй строке ставить шиниру ячеек уже бесполезно.

Как лечить - не помню.

rash · November 21, 2009

В ИЕ есть бага. Если первая строка содержит colspan, то во второй строке ставить шиниру ячеек уже бесполезно.
Как лечить - не помню.

Разбить на 2 таблицы? -)

Ну это только для раскладки подойдет, конечно.

psywalker · November 21, 2009

Чета в ФФ терь не работает

Странно, у меня вот этот код работает везде кроме ИЕ8, там шляпа какая-та

<!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>2col</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
html, body{
	width:100%;
	height:100%;
	margin:0;
	padding:0;
	background:#FFF;
	}

body{
	font-family:Tahoma;
	font-size:0.75em;
	}

.main{
	width:100%;
	height:100%;
	margin:0 auto;
	border-collapse:collapse;
	}

.main td{
	vertical-align:top;
	}


* html .main{
	height:100%;
	}

.header{
	height:150px;
	background:#F00;
	}

	.logo{
		width:500px;
		height:150px;
		margin:0 auto;
		background:#00F;
		}

.left-bar{
	width: 200px;
	background:#FCC;
	height: 100px;
	height: 100%;
	height: expression(this.offsetParent.offsetParent.offsetHeight - 260);

}

.content{
	background:#FF0;
	width: 100%;
}

.footer{
	height:100px;
	background:#00F;
	}

</style>
</head>
<body>
<table class="main">
	<tr>
		<td colspan="2" class="header">
			<div class="logo">Логотип</div>

		</td>
	</tr>
	<tr>
		<td class="left-bar"><div style="width: 200px;">Left bargfdgdg dfgd ddg</div></td>
		<td class="content">Content</td>
	</tr>
	<tr>
		<td colspan="2" class="footer">Footer</td>

	</tr>
</table>
</body>
</html>

В ИЕ есть бага. Если первая строка содержит colspan, то во второй строке ставить шиниру ячеек уже бесполезно.
Как лечить - не помню.

да чёто я колспаны убрал, а в ИЕ8 всё равно кал

Justnewone · November 21, 2009

Ага, в IE8 не особо

psywalker · November 21, 2009

Принимайте, распишитесь

<!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" xml:lang="en" lang="en">
<head>
	<title>Table</title>
	<meta http-equiv="content-type" content="text/html;charset=utf-8" />

		<style type="text/css">
		* { margin: 0;padding: 0;}

		html,body {height: 100%;}

		table {
			width: 100%;
			height: 100%;
			border-collapse: collapse;
		}

		td.left {
			background: red;
			width: 300px;
			height: expression(this.offsetParent.offsetParent.offsetHeight - 200);
		}

		td.content { background: green;}

		td.z { height: 100px;background: blue;}
	</style>
</head>
<body>

	<table>
		<tr>
			<td class="z" colspan="2"></td>
		</tr>
		<tr>
			<td class="left"></td>
			<td class="content"></td>
		</tr>
		<tr>
			<td class="z" colspan="2"></td>
		</tr>
	</table>

</body>
</html>

И даже колспаны не помогли никому уйти от ответственности

Edited November 21, 2009 by psywalker

Clayton · November 21, 2009

Давно сам тоже не верстал на таблица, сейчас посмотрел ради интереса, можно еще так делать, как вариант без expression:

<!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>2col</title> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<style type="text/css"> 
html, body {margin:0; padding:0; height:100%;}
#top {height:50px; background-color:#F00;}
.left_bar {background-color:#F90; width:200px;}
.content {background-color:#FC0; height:60%;}
.footer {background:#666; color:#fff; height:40%;}
table {width:100%; height:100%;}
</style>
</head> 
<body> 
<table>
  <tr id="top">
	<td colspan="2">Шапка</td>
  </tr>
  <tr>
	<td class="left_bar">Навигация</td>
	<td class="content">Контент</td>
  </tr>
  <tr>
	<td colspan="2" class="footer">Подвал</td>
  </tr>
</table>

</body> 
</html>

psywalker · November 21, 2009

Давно сам тоже не верстал на таблица, сейчас посмотрел ради интереса, можно еще так делать, как вариант без expression:

<!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>2col</title> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<style type="text/css"> 
html, body {margin:0; padding:0; height:100%;}
#top {height:50px; background-color:#F00;}
.left_bar {background-color:#F90; width:200px;}
.content {background-color:#FC0; height:60%;}
.footer {background:#666; color:#fff; height:40%;}
table {width:100%; height:100%;}
</style>
</head> 
<body> 
<table>
  <tr id="top">
	<td colspan="2">Шапка</td>
  </tr>
  <tr>
	<td class="left_bar">Навигация</td>
	<td class="content">Контент</td>
  </tr>
  <tr>
	<td colspan="2" class="footer">Подвал</td>
  </tr>
</table>

</body> 
</html>

Не прокатит, во первых ты не понял задачи, а во вторых у тебя косяки в ИЕ

И без Экспрешана к сожалению не получится решить эту хрень

Edited November 21, 2009 by psywalker

Clayton · November 21, 2009

Какие именна косяки в каких ие? вроде проверил

psywalker · November 21, 2009

Какие именна косяки в каких ие? вроде проверил

1) Во всех ИЕ полоса прокрутки

2) Подвал не 150пк в высоту

mishka · November 21, 2009

Опыта верстки таблиц у меня немного. Но раз столкнулся с таким багом. Ие нехотят понимать ширину ячеек в пикселях. Причем иногда понимают, иногда нет. Я так понял колспаны сбивают ие.

У меня тогда ширина была фиксированная и я для ие сделал перерасчет в проценты. А для всех остальных в пикселях, так как хром и сафари отказались понимать проценты.

Sign In

ну никак не хочет отображаться нормально

Question

Link to comment

Share on other sites

Top Posters For This Question

Popular Days

Top Posters For This Question

Popular Days

51 answers to this question

Recommended Posts

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Join the conversation

Обсуждения

Important Information