отцентрировать текст в колонке

[Nomo]

Объемный прайс в виде таблицы. Заданы col-ы . Нужно отцентрировать текст только в одной колонке. Дабы не задавать класс для каждой нужной ячейки, задала класс для нужной колонки, но почему-то не работает. Код и css в норме, ручаюсь. Может быть col вообще не работает, по крайней мере в FF???

col.d {

text-align: center;

}

[Fu-tai]

А к чему такое обращение к классу "col.d" ? Это лишнее и скорее всего поэтому оно и не реботает достаточно писать .d и все должно заработать!

Кстати а что за тег такой

[Vlad]

Точно, с тегом COL сплошные проблемы, в FF не работает.

[Nomo]

А к чему такое обращение к классу "col.d" ? Это лишнее и скорее всего поэтому оно и не реботает достаточно писать .d и все должно заработать!

Кстати а что за тег такой

1. http://htmlbook.ru/html/tbody.html за этим тегом идет тело таблицы.

2. если у тебя большая таблица стилей и сложная верста такой метод обращения несколько упрощает поиск и образное представление того с чем имеешь дело. Это привычка, для удобства. Такой метод обращения вполне "законен".

[Nomo]

Точно, с тегом COL сплошные проблемы, в FF не работает.

печально, не знаю что теперь делать, рутинным подставлением классов совсем не хочется заниматься...но кажется вариантов тут не много.

[SkyLight]

у тега TH по умолчанию стоит центрирование. Можно использовать его, установив в CSS, свойства для всех TH, находящихся внутри TBODY (ну так, типа, шоб шрифт не жирный и т.д.). Так получаем одно описание в CSS и ничего не пишем в class.

[Nomo]

у тега TH по умолчанию стоит центрирование. Можно использовать его, установив в CSS, свойства для всех TH, находящихся внутри TBODY (ну так, типа, шоб шрифт не жирный и т.д.). Так получаем одно описание в CSS и ничего не пишем в class.

Проблема в том, что таблица уже давно сверстана и

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

P.S. все таки я подставила классы, по времени это заняло цельных 40 минут, а все потому, что поленилась сделать все грамотно в начале.

[Tokolist]

а) что мешало написать

б) ИМХО Опера и ФФ правильно делают, так как эти свойства должны наследоватся, а теги

не вложены в тег

[Nomo]

а) что мешало написать

б) ИМХО Опера и ФФ правильно делают, так как эти свойства должны наследоватся, а теги

не вложены в тег

a) ничего не мешало, кроме того, что это не работает в половине браузеров и то, что я никогда не мешаю стили с кодом, все стили и описания находятся в CSS.

б) не знаю кто там, что правильно/не правильно делает, весь ужас в том, что всем плевать на стандарты, которые существуют (W3C).

[yopopt]

По спецификации (http://www.w3.org/TR/CSS21/tables.html#q4) к тегу col можно применить только четыре свойства: border, background, width и visiblility. А ie просто выпендрился.

[Nomo]

По спецификации (http://www.w3.org/TR/CSS21/tables.html#q4) к тегу col можно применить только четыре свойства: border, background, width и visiblility. А ie просто выпендрился.

Спасибо за ссылку на спецификацию, это уже ближе к делу. )

[Tokolist]

a) ничего не мешало, кроме того, что это не работает в половине браузеров и то, что я никогда не мешаю стили с кодом, все стили и описания находятся в CSS.

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

Короче сегодня мно-о-ого времени провел с Фоксом и Фаербагом и сделал вывод, что в стилях с пользой можно применить только width, который, кстати, будет работать везде.

Поэтому будем укрощать тупые браузеры типа Оперы и Фокса (шучу шучу )

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

А самое главное не используем никакие скрипты и код будет валидным.

1. центрируется только первая колонка

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title></title>
<style type="text/css">
/* для всех */
table.foo {
 border-collapse: collapse;
}

table.foo td {
 padding: .5em;
 border: 1px solid #000;
}

table.foo col {
 width: 500px;
}

/* для ИЕ, мать его */
table.foo col.alcen {
 text-align: center;
}

/* для Фокса и Оперы, мать их */
table.foo td:first-child {
 text-align: center;
}
</style>
</head>
<body>

<table class="foo">
<col class="alcen">
<col>
<tbody>
<tr>
 <td>col1</td>
 <td>col2</td>
</tr>
<tr>
 <td>col1</td>
 <td>col2</td>
</tr>
<tr>
 <td>col1</td>
 <td>col2</td>
</tr>
<tr>
 <td>col1</td>
 <td>col2</td>
</tr>
<tr>
 <td>col1</td>
 <td>col2</td>
</tr>
</tbody>
</table>

</body>
</html>

2. центрируются все кроме первой

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title></title>
<style type="text/css">
/* для всех */
table.foo {
 border-collapse: collapse;
}

table.foo td {
 padding: .5em;
 border: 1px solid #000;
}

table.foo col {
 width: 100px;
}

/* для ИЕ, мать его */
table.foo col.alcen {
 text-align: center;
}

/* для Фокса и Оперы, мать их */
table.foo td+td {
 text-align: center;
}
</style>
</head>
<body>

<table class="foo">
<col>
<col class="alcen">
<col class="alcen">
<col class="alcen">
<tbody>
<tr>
 <td>col1</td>
 <td>col2</td>
 <td>col3</td>
 <td>col4</td>
</tr>
<tr>
 <td>col1</td>
 <td>col2</td>
 <td>col3</td>
 <td>col4</td>
</tr>
<tr>
 <td>col1</td>
 <td>col2</td>
 <td>col3</td>
 <td>col4</td>
</tr>
<tr>
 <td>col1</td>
 <td>col2</td>
 <td>col3</td>
 <td>col4</td>
</tr>
<tr>
 <td>col1</td>
 <td>col2</td>
 <td>col3</td>
 <td>col4</td>
</tr>
</tbody>
</table>

</body>
</html>

3. центрируется только третяя колонка

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title></title>
<style type="text/css">
/* для всех */
table.foo {
 border-collapse: collapse;
}

table.foo td {
 padding: .5em;
 border: 1px solid #000;
}

table.foo col {
 width: 100px;
}

/* для ИЕ, мать его */
table.foo col.alcen {
 text-align: center;
}

/* для Фокса и Оперы, мать их */
table.foo td+td+td {
 text-align: center;
}

table.foo td+td+td+td {
 text-align: left;
}
</style>
</head>
<body>

<table class="foo">
<col>
<col>
<col class="alcen">
<col>
<tbody>
<tr>
 <td>col1</td>
 <td>col2</td>
 <td>col3</td>
 <td>col4</td>
</tr>
<tr>
 <td>col1</td>
 <td>col2</td>
 <td>col3</td>
 <td>col4</td>
</tr>
<tr>
 <td>col1</td>
 <td>col2</td>
 <td>col3</td>
 <td>col4</td>
</tr>
<tr>
 <td>col1</td>
 <td>col2</td>
 <td>col3</td>
 <td>col4</td>
</tr>
<tr>
 <td>col1</td>
 <td>col2</td>
 <td>col3</td>
 <td>col4</td>
</tr>
</tbody>
</table>

</body>
</html>

и т.д. в таком же духе в зависимости от потребностей

[yopopt]

Tokolist +1 Весьма интересно и поучительно.

[zest]

Tokolist, подскажите пожалуйста, где можно почитать про css-селекторы, которые вы применили. Первый раз встречаю такой css-код.

[Nomo]

Tokolist - Здорово, спасибо)

[SkyLight]

Tokolist, подскажите пожалуйста, где можно почитать про css-селекторы, которые вы применили. Первый раз встречаю такой css-код.

Возможно вас это удивит, но вс? же на www.w3.org

[zest]

Tokolist, подскажите пожалуйста, где можно почитать про css-селекторы, которые вы применили. Первый раз встречаю такой css-код.

Возможно вас это удивит, но вс? же на www.w3.org

Нет ничего удивительного в этом мире. ;-)

Спасибо за детальную ссылочку.