Лучше использовать фиксированную или процентную ширину столбца для таблицы HTML?

Question

Я отображаю некоторые табличные данные на своем веб-сайте, поэтому я решил использовать некоторые таблицы. Лучше ли использовать фиксированную ширину для столбцов таблицы (т.е. 100px) или использовать ширину в процентах?

Answer 1

Я бы не рекомендовал фиксированную ширину, так как размер текста в браузерах может отличаться. Правильнее всего ничего не делать! Оставьте стол для размера самого себя. Принудительное использование ширины таблицы на 100% является вариантом, но может оставить много пробелов.

Насколько большим будет стол на моем мобильном телефоне, телевизоре или настольном ПК? Чем больше вы заставляете макет, тем хуже он выглядит на неожиданных платформах.

Answer 2

Что касается ответа DeadAccount, не используйте W3Schools, у них есть привычка получать полуправочную информацию.

http://w3fools.com/

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

Answer 3

Я широко использую (d) пропорциональную ширину с HTML, который должен работать в браузерах и CSS2XSLFO.

Однако Firefox 3.x убрал поддержку ширины PCW в столбцах таблицы.

См. https://bugzilla.mozilla.org/show_bug.cgi?id=333352

Так что вам придется использовать% widths.

Я никогда не использую фиксированную ширину (например, 50 пикселей), однако я использую единицы em или ex в дополнение к ширине pcw или в процентах.

Answer 4

Для табличных данных я думаю, что относительный (процент) должен быть хорошим.

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

Answer 5

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

Answer 6

Я согласен с Квигли, однако «правильный» подход во многом зависит от вашего конкретного контекста. Если вам нужно просто отображать простые данные на веб-сайте, в основном просто распечатывать данные в формате HTML, я бы также оставил таблицу как есть. Что вы должны сделать, это установить его ширину 100% s.t. он расширяется на всю ширину страницы. Если он находится внутри другого контейнера (например, div или другого тега), он расширится до ширины этого контейнера.

Однако, если вы хотите, чтобы ваша таблица просто расширялась до определенной ширины, я бы выбрал процентные значения вместо фиксированных таблиц, в основном из-за того, что у ваших пользователей будут разные размеры и разрешение экрана и, следовательно, соответствующее окно браузера. с может отличаться. Однако в таком случае я бы рассмотрел такие атрибуты, как min-width, который определяет минимальную ширину, которую получит ваша таблица. Атрибут отлично работает в Firefox, Safari и т. Д., Однако в IE (как обычно) вы должны сделать трюк, чтобы добиться минимальной ширины, добавив что-то вроде следующего в ваш класс CSS (который вы добавляете в контейнер HTML) стол или к самому столу):

width: expression( this.scrollWidth < 70 ? "70px" : "auto" );

Это просто пример, который задает минимальную ширину 70 пикселей, в противном случае он не устанавливает ширину. Вы можете настроить его под свои нужды.