Jump to content
  • 0

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

boy_from_Mexico

Asked by boy_from_Mexico,

 Share

Question

boy_from_Mexico Explorer

boy_from_Mexico

Posted
Posted (edited)

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

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

вот код:

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

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

<head>

<link rel="stylesheet" type="text/css" href="styleIE.css">

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

</head>

<body style="background: url(wall.jpg);">

<table height=800 width=90% style="border:solid 1px red;" >

<tr id="header">

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

</tr>

<tr id="mainer">

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

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

</tr>

<tr id="footer">

<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 by boy_from_Mexico
Link to comment
Share on other sites
  • Answers 51
  • Created
  • Last Reply

Top Posters For This Question

Popular Days

Top Posters For This Question

Popular Days

51 answers to this question

Recommended Posts

  • 0
psywalker Explorer

psywalker

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

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

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

Link to comment
Share on other sites
  • 0
mishka Explorer

mishka

Posted
Posted (edited)

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

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

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

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

Edited by mishka2
Link to comment
Share on other sites
  • 0
Clayton Explorer

Clayton

Posted
Posted (edited)

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

Edited by Clayton
Link to comment
Share on other sites
  • 0
mishka Explorer

mishka

Posted
Posted

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

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

Link to comment
Share on other sites
  • 0
psywalker Explorer

psywalker

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

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

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

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

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

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

Link to comment
Share on other sites
  • 0
mishka Explorer

mishka

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

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

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

Link to comment
Share on other sites
  • 0
psywalker Explorer

psywalker

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

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

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

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

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

Edited by psywalker
Link to comment
Share on other sites
  • 0
Clayton Explorer

Clayton

Posted
Posted

А зачем вообще тянуть ее по вертикали, это принципиальная что ли задача была?

Я б уже так сделал

<!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>

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

Link to comment
Share on other sites
  • 0
Clayton Explorer

Clayton

Posted
Posted 

<!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 появился и сказал: Это не решение задачи! :)

Link to comment
Share on other sites
  • 0
mishka Explorer

mishka

Posted
Posted (edited)

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

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

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

Edited by mishka2
Link to comment
Share on other sites
  • 0
Clayton Explorer

Clayton

Posted
Posted 

* 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 и всей таблице в том числе. Тогда стоки и столбцы нормально принимают значения в пикселях. :)

Link to comment
Share on other sites
  • 0
psywalker Explorer

psywalker

Posted
Posted

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

Link to comment
Share on other sites
  • 0
Clayton Explorer

Clayton

Posted
Posted (edited)

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

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

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

Edited by Clayton
Link to comment
Share on other sites
  • 0
psywalker Explorer

psywalker

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

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

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

Link to comment
Share on other sites
  • 0
Clayton Explorer

Clayton

Posted
Posted (edited)

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

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 by Clayton
Link to comment
Share on other sites
  • 0
boy_from_Mexico Explorer

boy_from_Mexico

Posted
  • Author
Posted

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

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

Link to comment
Share on other sites
  • 0
Justnewone Explorer

Justnewone

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

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

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

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Answer this question...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
 Share
Go to question listing
×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue. See more about our Guidelines and Privacy Policy

  I accept