Компьютерный форум OSzone.net  

Компьютерный форум OSzone.net (http://forum.oszone.net/index.php)
-   Вебмастеру (http://forum.oszone.net/forumdisplay.php?f=22)
-   -   выравнивание в разных браузерах (http://forum.oszone.net/showthread.php?t=112351)

toro 26-07-2008 23:25 861778
выравнивание в разных браузерах
 
Табличная вёрстка. Таблица центрируется по центру. Голова вот такая:
<html>
<HEAD>
<META ..... >
<link rel="stylesheet" href="stat.css" type="text/css">
<style type="text/css">
html {
height:100%;
margin:0px;
padding:0px;
text-align:center;
}
body {
height:auto !important;
min-height:100%;
height:100%;
vertical-align:top;
text-align:center;
margin:0px;
padding:0px;
color: White;
}
table {
border:0px;
border-collapse:collapse;
vertical-align:top;
text-align:center;
}
</style>
<body>
<table style="width:777px;>
.....
</body>
</html>
В IE6\7 всё нормально. А вот в Opera и Mozilla Firefox таблица прижимается к левому краю.
Что надо дописать для этих браузеров?

timon4ik 28-07-2008 01:28 862400
Попробуйте
<center>
<table style="width:777px;>
.....
</center>

toro 28-07-2008 23:36 863173
Попробую. Отпишусь что вышло.

Delirium 29-07-2008 02:11 863245
Цитата:
Цитата toro
<table style="width:777px;> »
а кавычки после 777px закрывать не надо?

toro 05-08-2008 00:39 867998
Цитата:
Цитата Delirium
а кавычки после 777px закрывать не надо? »
Надо. Однозначно. Когда тему размещал потёр нечаяно, в реальности они есть.

Цитата:
Цитата timon4ik
Попробуйте <center> »
Попробовал. Отличное лекарство. Всё по центру.
Вобщем для базовой таблицы (нашёл рецепт) добавил в стиль margin:0 auto; А вот для вложенных таблиц гораздо правильнее себя ведёт тег <center></center>. Спасибо за советы.

Кстати, а как лучше выравнивать содержимое ячеек (картинки (не на всю высоту ячейки) и ссылки) таблицы по вертикали для FF и Opera? text-align:middle не всегда срабатывает. Содержимое прижимается к низу ячеек.

Delirium 05-08-2008 01:22 868023
HTML код:
<table border=1>
<tr>
<td><a href="http://www.oszone.net">Ссылка на oszone</a></td>
<td><img src="1.gif" /></td>
<td><img src="1.gif" /><br><img src="1.gif" /></td>
</tr>
</table>
У меня при таком коде все выравнивается по вертикали по центру. Может к таблице стиль CSS прикручен?
Можно попробовать написать вот так:
Код:
<td valign=middle><img src="1.gif" /></td>
- выравнивание идет по центру, valign=top - по верху

timon4ik 05-08-2008 11:50 868321
Цитата:
Цитата toro
text-align:middle не всегда срабатывает »
Для вертикального выравнивания надо использовать vertical-align

toro 06-08-2008 00:19 869000
Мда, спешка. Извиняюсь. На самом деле в стилях на сайте написано именно vertical-align: middle;
Я запихнул внутрь ячейки и ссылки без разделения картинки и текст. Это наверное плохой ход, но в IE6\7 тем неменее всё нормально. Может дело в таком решении? Вот код:

<table id="centrmenu">
<tr><td width="19%">
<A href="index.php?page=new"><img src="images/3.gif" width="8" height="8"> НА ГЛАВНУЮ <img src="images/3.gif" width="8" height="8"></a></td>....

В CCS прописано:
#centrmenu {
text-align: center;
vertical-align: middle;
margin: 0px;
width: 100%;
}

#centrmenu td {
text-align: center;
vertical-align: middle;
padding: 0px;
}

#centrmenu A:link, #centrmenu A:active, #centrmenu A:visited {
text-decoration: none;
border-top: 2px solid White;
border-bottom: 2px solid White;
vertical-align: middle;
}

#centrmenu A:hover {
border-top: 2px solid Red;
border-bottom: 2px solid Red;
color: Red;
}

Delirium 06-08-2008 01:20 869035
У меня по умолчанию без CSS все позиционируется по центру вертикально. Что, если убрать данный пункт из css ?

toro 07-08-2008 00:10 869886
Попробовал, но увы, лучше не стало. Самое смешное, что у меня в строке 6 ячеек с так оформленными ссылками. Так вот в одной прижимается контент к низу, в другой посередине, в следующей к низу, следующей посередине..... Пробую увеличить\уменьшить кол-во ячеек - закономерность "через одну нормально" остаётся. Бредятина какая-то :(

toro 07-08-2008 23:50 870740
Дело немного сдвинулось. Начал убирать\добавлять по одному стили. И выяснилось следующее - тест внутри ссылки лучше обрамлять, н-р, в strong. И высоту шрифта давать именно в стилях <strong>, а не в <a>. Это одна из причин. А вторая кроется в отображении border-top: 2px solid White; и border-bottom: 2px solid White; в стилях ссылок. В IE бордеры прижимаются к ссылке, т.е. текст и рисунки в обрамлении вернего и нижнего бордеров. А вот в FF бордеры "убегают" от ссылки и похоже прижимаются к границам ячейки в которую вставлена ссылка, т.е. между текстом ссылки и границами теперь большое пространство. Никто не знает как прижать бордеры к ссылке?

Delirium 10-08-2008 15:56 872253
cellpadding, cellspacing ?

toro 10-08-2008 23:14 872570
По нулям (:)), через стили.

MID3000 28-08-2008 13:43 885794
На сколько я помню, как раз в CSS на счёт отступов есть ещё что-то кроме
Цитата:
Цитата Delirium
cellpadding, cellspacing »


Время: 16:29.

Время: 16:29.
© OSzone.net 2001-