Jump to content
  • 0

Проблемы с табличной версткой в IE


hooey_ru
 Share

Question

К сожалению, не осилил верстку дивами (я честно пытался, и не один день!), поэтому пришлось делать все таблицей. Везде показывается нормально, кроме любимого браузера.

http://sparrows.org.ua/about.php?en

Итак, структура страницы такая:

1208109_420x300.png

Так вот, в IE меню съезжает в самый низ страницы. Это как-то можно вылечить?

Link to comment
Share on other sites

7 answers to this question

Recommended Posts

  • 0

<td valign=bottom height=425>
<!--<li class="menulink"><a href="/about.php?en" class="menulink">About</a></li>
<li class="menulink"><a href="/fantasy.php?en" class="menulink">Fantasy</a></li>
<li class="menulink"><a href="/sparrows.php?en" class="menulink">Sparrows</a></li>
<li class="menulink"><a href="/live.php?en" class="menulink">Live</a></li>
<li class="menulink"><a href="/contact.php?en" class="menulink">Contact info</a></li> -->

<li class="menulink"><a href="/about.php?en" class="menulink"><img onMouseOver="MM_swapImage('imgAboot','','menu/about_2_en.png',1)" onMouseOut="MM_swapImgRestore()" src="menu/about_1_en.png" name="imgAboot" alt="About"></a></li>
<li class="menulink"><a href="/fantasy.php?en" class="menulink"><img onMouseOver="MM_swapImage('imgFantasy','','menu/fantasy_2_en.png',1)" onMouseOut="MM_swapImgRestore()" src="menu/fantasy_1_en.png" name="imgFantasy" alt="Fantasy"></a></li>

<li class="menulink"><a href="/sparrows.php?en" class="menulink"><img onMouseOver="MM_swapImage('imgSparrows','','menu/sparrows_2_en.png',1)" onMouseOut="MM_swapImgRestore()" src="menu/sparrows_1_en.png" name="imgSparrows" alt="Sparrows"></a></li>
<li class="menulink"><a href="/live.php?en" class="menulink"><img onMouseOver="MM_swapImage('imgLive','','menu/live_2_en.png',1)" onMouseOut="MM_swapImgRestore()" src="menu/live_1_en.png" name="imgLive" alt="Live"></a></li>
<li class="menulink"><a href="/contact.php?en" class="menulink"><img onMouseOver="MM_swapImage('imgContact','','menu/contact_2_en.png',1)" onMouseOut="MM_swapImgRestore()" src="menu/contact_1_en.png" name="imgContact" alt="Contact info"></a></li>
</td>

1. valign="bottom" меняем на valign="top"

2. а куда пропал тег <ul> ?! оО

Link to comment
Share on other sites

  • 0

много лишнего кода... и непонятно что именно вам надо... толи в самый низ.. толи нет...

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

Link to comment
Share on other sites

  • 0

Посмотрите, в FF и остальных браузерах работает, это только в IE меню улетает вниз.

Я сейчас попробовал сделать иначе: пустая ячейка высотой 325px, а ниже — еще одна ячейка с valign=top и меню в ней. И все равно не помогает! Почему-то в IE высота ячейки не 325px, а намного больше.

Поздно делать блочную верстку, да там проблем еще больше. Я даже просто не представляю себе, как расположить дивы, чтобы получить такую же страницу, как сейчас.

Я в первом посте нарисовал картинку, где показано правильное расположение меню. Откройте одну и ту же страницу в FF и IE и сравните, где меню находится. В FF - как надо, а в IE — в самом конце страницы.

Link to comment
Share on other sites

  • 0

1208570_500x400.png

Какая именно ячейка лишняя? Допустим, нужно, чтобы меню находилось на расстоянии ровно 400px от верхнего края.

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

Ошибки валидатора посмотрел, то что не указан тип скрипта или <a><h1>...</h1></a> вместо <h1><a>...</a></h1> никак не влияет на отображение документа.

Добавил лишнего кода, валидатор проходится теперь, но все же, почему вообще IE может не соблюдать жестко заданную высоту ячейки?

Link to comment
Share on other sites

  • 0

ладно, проехали, засунул меню в див с position:absolute. Коряво, но вроде работает.

Только в IE почему-то у меню появился отступ слева, которого нет в остальных браузерах. padding:0 не спасает

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

×
×
  • 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