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

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 21, 2009

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

Я предоставил выше вариант с колспанами и экспрешаном, всё везде отлично работает

mishka · November 21, 2009

psywalker, в твоем примере все гладко пока таблица пуста. ты вставь в первую ячейку

<div style="background:#008000;height:150px;width:500px;">Логотип</div>

особенно в ие6 посмотри

Где такой експрешн нарыл? и что он делает?

Edited November 21, 2009 by mishka2

Clayton · November 21, 2009

Чето я запутался... Рушится все после того как указываем велиечну таблицы в 100%, 3 строки перерасчитываются поровну, и любое изменение идет еще в плюс... Походу действительно, надо перерассчитывать для ие в процент специально, в отдельный ксс

Edited November 21, 2009 by Clayton

mishka · November 21, 2009

Я бы советовал пытатся для всех делать в процентах. Если какойто из браузеров (кроме ие) откажется от процентов, то тогда для ие придется отдельно в процентах, а для всех в пикселях.

еще как вариант - в ячейки всунуть див, и уже дивам задавать ширину. Ток дивы надо сунуть во все ячейки, и всем ширину указывать.

psywalker · November 21, 2009

mishka2 said:
psywalker, в твоем примере все гладко пока таблица пуста. ты вставь в первую ячейку
<div style="background:#008000;height:150px;width:500px;">Логотип</div>
особенно в ие6 посмотри
Где такой експрешн нарыл? и что он делает?

Блин, вот это говно конеш, даа, неужели нет решения, даже не верится.

Экспрешан мне дал маньячело Great Rash, и запомни на всю жизнь: Никогда меня не спрашивай, что означает экспрешаан

mishka · November 21, 2009

Quote
и запомни на всю жизнь: Никогда меня не спрашивай, что означает экспрешаан

Ты что навсегда отказываешся изучить джс??

Он те експрешн давал который был для конкретной задачи, в конкретных условиях. Здесь видишь - некатит.

psywalker · November 21, 2009

mishka2 said:
Ты что навсегда отказываешся изучить джс??
Он те експрешн давал который был для конкретной задачи, в конкретных условиях. Здесь видишь - некатит.

Я не отказываюсь Мих, просто на данный момент это для меня трудно.

Он давал мне экпрешан, думая что он будет работать для всех задач, наверное тогда тоже не проверили

Прикинь косолапый, экспрешан мне зависон устроил всей системы, уже два раза даже пришлось перезагружатся...во блин прикол

Edited November 21, 2009 by psywalker

Clayton · 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 {margin:0; padding:0; background:#666; padding-bottom:10px;}
.top {background-color:#F00; height:10%;}
.left_bar {background-color:#F90; height:80%; width:200px;}
.content {background-color:#FC0; height:400px;}
table {width:100%; border-collapse:collapse; margin-bottom:10px;}
</style>
</head> 
<body> 
<table>
  <tr class="top">
	<td colspan="2"><div style="width:200px; background:#900; padding:50px 0 50px 0; margin:0 auto; text-align:center;">Логотип</div></td>
  </tr>
  <tr>
	<td class="left_bar">Навигация</td>
	<td class="content">Контент</td>
  </tr>
</table>
Подвал
</body> 
</html>

пускай ячейки тянутся самим контентом и ффсё.

psywalker · November 21, 2009

Нет, если бы так было всё легко, мы бы не парились, интересно найти решение именно нашей задачи. Или ты её решаешь или прекрати глумиться

Clayton · November 21, 2009

В данном случае "задача" легко решается дивами с прижатым футером. Раз так принципиально.

А вообще я спать пошел. Решайте

Clayton · November 22, 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 {margin:0; padding:0; height:100%; position:relative;}
.top {background-color:#F00; height:100px; width:100%; position:absolute; top:0;}
.left_bar {background-color:#F90; width:200px; vertical-align:top; padding:99px 0 99px 0; }
.content {background-color:#FC0; vertical-align:top; padding:99px 0 99px 0;}
.footer {background:#666; color:#fff; height:100px; width:100%; position:absolute; bottom:-1px;}
table {width:100%; height:100%; border-collapse:collapse;}
</style>
</head> 
<body>
<div class="top"></div>
<table>
  <tr>
	 <td class="left_bar">wer</td>
	 <td class="content">wer</td>
  </tr>
</table>
<div class="footer">Подвал</div>
</body> 
</html>

И тут psywalker появился и сказал: Это не решение задачи!

mishka · November 22, 2009

И тут еще не успел появится psywalker, но появляюсь я и говорю: "Это не решение задачи!"

Ты контент добавь. И побольше желательно.

Тс говорил что не пытался футер прибивать вниз. Он просто задал высоту чтобы лучше видно было.

Edited November 22, 2009 by mishka2

Clayton · November 22, 2009

Ах сцуко, виноват. Ну это то я исправлю ща

Clayton · November 22, 2009

* html body {height:100%;}
html {height:100%;}
body {min-height:100%; position:relative; margin:0; padding:0;}
.top {background-color:#F00; height:100px; width:100%; position:absolute; top:0;}
.left_bar {background-color:#F90; width:200px; vertical-align:top; padding:99px 0 99px 0; }
.content {background-color:#FC0; vertical-align:top; padding:99px 0 99px 0;}
.footer {background:#666; color:#fff; height:100px; width:100%; position:absolute; bottom:0;}
table {width:100%; height:100%; border-collapse:collapse;}

Вообще я не понял тогда действительно задачу. Раз не нужно ничего прижимать, то в чем проблема? Не нужно задавать высоту html и body и всей таблице в том числе. Тогда стоки и столбцы нормально принимают значения в пикселях.

psywalker · November 22, 2009

А вот тут появляется psywalker и говорит: Хватит предлагать решения из другой задачи, в нашей задаче условия прости, тупо сделать таблицу, которая имеет фикс Хедер и Футер, а Середина должна тянуться, чтобы этот Хедер с Футером находились всегда на своих законных местах, тоесть сверху и снизу...Если тебе и так непонятно, то открой мой код в ФФ и просто тупо сравни с ИЕ, поймёшь в чём косяк

Clayton · November 22, 2009

Ну хорошо, что на данном этапе не так вэтой таблице. Вроде и контента дохрена, и на месте всё.

psywalker · November 22, 2009

Clayton said:
Ну хорошо, что на данном этапе не так вэтой таблице. Вроде и контента дохрена, и на месте всё.

Нет, подвал не прижат

Clayton · November 22, 2009

так вот всё таки подвал должен быть прижат или нет?

Quote
Тс говорил что не пытался футер прибивать вниз. Он просто задал высоту чтобы лучше видно было.

Quote
Нет, подвал не прижат

Если ТС действительно не говорил что подвал не должен быть прижат, значит он не должен быть прижат, если он всё-таки должен быть прижат, то решение которое я до этого предлагал, примерно то что нужно. С небольшими доработками конечно.

Edited November 22, 2009 by Clayton

psywalker · November 22, 2009

Clayton said:
так вот всё таки подвал должен быть прижат или нет?
Если ТС действительно не говорил что подвал не должен быть прижат, значит он не должен быть прижат, если он всё-таки должен быть прижат, то решение которое я до этого предлагал, примерно то что нужно. С небольшими доработками конечно.

Мы решаем задачу с ПРИЖАТЫМ подвалом, а что решает ТС - это уже его личные дела

Clayton · November 22, 2009

Ах вотоно что)

ну чисто на таблице такую куйню не слабать...

psywalker · November 22, 2009

Clayton said:
Ах вотоно что)
ну чисто на таблице такую куйню не слабать...

Ну надо же, хорошо что ты ответил нам наконец, а то мы запарились решение искать

Clayton · November 22, 2009

psywalker said:
Ну надо же, хорошо что ты ответил нам наконец, а то мы запарились решение искать

Ищите-ищите) Кто ищет - тот всегда найдет)

Clayton · November 22, 2009

в общем ниче больше в голову не приходит:

html, body {margin:0; height:100%; padding:0;}
.top {background-color:#F00; height:100px;}
	 .top div {margin:0 auto; width:200px; height:100px; background:#999;}
.left_bar {background-color:#F90; width:200px; vertical-align:top; padding:10px 0 10px 0; }
.content {background-color:#FC0; vertical-align:top; padding:10px 0 10px 0;}
.footer {background:#666; color:#fff; height:100px; width:100%; bottom:0;}
table {width:100%; height:100%; border-collapse:collapse;}

<!--[if lt IE 8]>
<style type="text/css">
.content {height:80%;}
</style>
<![endif]-->

<table>
  <tr class="top">
	  <td colspan="2"><div>Лого</div></td>
  </tr>
  <tr>
	 <td class="left_bar">Навигация</td>
	 <td class="content">Контент</td>
  </tr>
  <tr class="footer">
  <td colspan="2">Подвал</td>
  </tr>
</table>

В ие 6-7 появляется вертикальная полоса прокрутки, из за .content {height:80%;} но зато шапка и подвал на месте. В остальных норм.

Edited November 22, 2009 by Clayton

boy_from_Mexico · November 23, 2009

а кто-нибудь может объяснить почему у IE всегда все через ж.пу,простите за сквернословие?

неужели Microsoft не может сделать хотябы нормальный браузер,не говоря уже об ОС)?

Justnewone · November 23, 2009

boy_from_Mexico said:
а кто-нибудь может объяснить почему у IE всегда все через ж.пу,простите за сквернословие?
неужели Microsoft не может сделать хотябы нормальный браузер,не говоря уже об ОС)?

Ну, это глубоко философский вопрос, идем знач в нирвану, а там сразу за углом ответ.

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