Не удается обвести линии вокруг границ таблицы / ячеек - PullRequest
Новая
       25

Не удается обвести линии вокруг границ таблицы / ячеек

1 голос
/ 30 июня 2011

У меня есть несколько веб-страниц, содержащих таблицы, для которых я хотел бы иметь границы строк вокруг таблиц и ячеек.Фактически, некоторые из этих страниц существуют уже несколько лет и приемлемо отображаются в IE6, IE7.

Мы около 6 месяцев назад перешли на совершенно другой набор таблиц стилей, чтобы изменить внешний вид и восприятие нашего сайта.Мы также переключились на «современные» браузеры, такие как IE8 (и потому что я не мог остановить Vista) на IE9.

Теперь границы вообще не отображаются.

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

Вот одна из таких страниц: 

http://www.semdesigns.com/products/DMS/DMSComparison.html

Таблицы должны быть очевидными;вы можете сказать им по их отсутствию строк: - {

URI проверяет использование сервиса W3C в качестве HTML 4.01 Transitional.

Есть предложения?

РЕДАКТИРОВАТЬ: все постеры отмеченычто новые таблицы стилей устанавливают границы по умолчанию на 0. Ой!

Ответы [ 3 ]

3 голосов
/ 30 июня 2011

Из того, что я вижу, у вас есть граница: 0; в оформлении столов.

Это скроет границы таблиц.

2 голосов
/ 30 июня 2011

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

Чтобы установить границу вокруг только таблицы, просто используйте table.box {border:1px solid #000}.Однако если вы установите границу со всех сторон таблицы и ячеек , у вас будет граница в два раза толще, чем вам нужно.

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

table.box {
    border-top: 1px solid #000;
    border-right: 1px solid #000;
}

table.box td {
    border-bottom: 1px solid #000;
    border-left: 1px solid #000;
}

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

2 голосов
/ 30 июня 2011

Я также не вижу границ в Firefox.

  1. SDstyle.css, строка 16. Вы выполняете сброс CSS, который устанавливает border: 0; для большого списка тегов, включая table, td, tr, th ...

  2. Вы объявляете свою таблицу как <table class="box">, но в то же время у вас нет такого стиля, определенного в вашем CSSфайлы.

...