Всех друзей поздравляем с Новым годом! Всего вам самого наилучшего! Всех благ, здоровья а материальное приложится!
СКРИПТЫ althtmlcssphpjsblog

Резиновая таблица, Растянуть таблицу.

Поддержи проект!!! smile

Когда вам требуется сделать резиновую таблицу. То прежде всего – вам следует знать, что у страницы есть отступы по умолчанию, которые вам не позволят сделать резиновую таблицу и растянуть её без ошибки.

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

Первыми шагом уничтожим margin по умолчанию, который составляет 8 px. Если мы умножим 8 px на 2 то получим 16 px сбоку нашей резиновой таблицы, поэтому наш браузер и будет отображать колесо прокрутки.

margin: 0px;

Ну и далее, как говорится – дело в шляпе!

Создаем требуемую таблицу - не буду приводить код резиновой таблицы – вы сможете посмотреть его нажав в браузере сочетание клавиш ctrl + U - ниже ссылка на пример.

Но как сделать резиновую таблицу!?

Для этого нужно вместо пикселей поставить проценты! Общая ширина таблицы – будет равна 100%, ну и остальные столбцы нужно поделить тоже на проценты. Для одного из столбцов ширину ставить не обязательно, он будет пропорционально уменьшаться в зависимости от поведения других столбцов!

Например таким образом:

table {

width: 100%;

}

Пример

Вас может еще заинтересовать список тем : #HTML | #CSS | #TABLE |
//dwweb.ru/comments_1_5/include/img/hand_no_foto.png
no
no
Еще никто не прокомментировал! COMMENTS+   BBcode
аватар
🞨
Загрузить свой аватар
(max ширина, высота = 200px)

Подписаться + =
Теги:

Последние комментарии :
Марат :
19/01/2021 01:13
Всегда пожалуйста!Приходите ещё!
подробнее.
аркадий :
19/01/2021 01:08
Спасибо!Меню вернулось. Класс!
подробнее.
Прохожий :
02/01/2021 10:44
Здравствуйте Марат!Спасибо Вам, за оперативность и развернутый ответ с примерами. И ОГРОМНОЕ спасибо, что…
подробнее.
Марат :
01/01/2021 03:30
И вас с Новым годом!Посмотрите …
подробнее.
Прохожий :
31/12/2020 03:58
А как проверить, чекнут ли чекбокс программно, то есть - другим скриптом, а не мышкой?Вот тут…
подробнее.