Растянуть таблицу на всю ширину без отступов (CSS)

Чтобы растянуть таблицу на всю ширину браузера и по краям не было отступов, сперва необходимо обнулить внешние и внутренние отступы тегов <body> и <html>, затем установить значение width: 100%.

Пример

Наглядный пример.

<!DOCTYPE html><html><head><meta charset="utf-8"><title>Растянуть таблицу на всю ширину без отступов (CSS)</title> <style> /** * Чтобы не было отступов, необходимо обнулить отступы * у тегов body и html */ html, body { margin: 0; padding: 0; } /** * Ставим ширину 100% */ table { width: 100%; border-collapse: collapse; } th, td { border: #ccc 1px solid; padding: 5px 10px; } </style> </head><body> <table> <tr> <th>Колонка 1</th> <th>Колонка 2</th> <th>Колонка 3</th> </tr> <tr> <td>Текст первой колонки</td> <td>Текст второй колонки</td> <td>Текст третьей колонки</td> </tr> </table> </body></html>

Категории

Веб-дизайнCSS

Комментарии