Как убрать отступы между ячейками таблицы css
Чтобы убрать стандартные отступы между колонками используется свойство border-collapse со свойством collapse . Это заставит «схлопнуться» ячейки. Если нужно вернуть отступы между ячейками, то стоит использовать значение separate
/* Добавляем границы для элементом и схлопываем их, чтобы убрать отступы */ table, td border: 1px solid #000; border-collapse: collapse; > 13 марта 2023
Если вы хотите сохранить отступы только по горизонтали, вы можете использовать свойство border-spacing и установить значение для горизонтальных и вертикальных отступов.
Пример блока CSS:
my-table border-collapse: separate; border-spacing: 0 10px; /* горизонтальный отступ 0, вертикальный 10px */ > Как убрать границу между ячейками таблицы html?
Всем привет) Не могу убрать границу между определенными ячейками html-таблицы, но при этом не объдиняя их. И оставить отступы других ячеек без изменения. Ячейка должна выглядеть как одна, но по факту там их две.
Отслеживать
задан 30 июл 2022 в 3:42
1 1 1 серебряный знак 1 1 бронзовый знак
Пожалуйста, уточните вашу конкретную проблему или приведите более подробную информацию о том, что именно вам нужно. В текущем виде сложно понять, что именно вы спрашиваете.
30 июл 2022 в 4:54
В макете сайта есть таблица (изображение таблицы: wampi.ru/image/RrKzPDO ) и там с виду одна колонка справа в tbody, но информация разделена на две ячейки. Может это как-нибудь по другому можно сделать?
30 июл 2022 в 5:23
1 ответ 1
Сортировка: Сброс на вариант по умолчанию
Манипулировать отступами между отдельным ячейками в таблице нельзя, можно пойти другим путем и использовать дополнительные элементы с position:absolute в td для создания border и эффекта отступа.
table < border: 3px solid #009dff; text-align: center; width: 100%; table-layout: fixed; border-spacing: 0; padding: 2px; font-family: arial; >thead < background-color: #f4af16; color: white; >thead tr:first-of-type td < border-bottom: 1px solid white; >thead tr:last-of-type td < border-bottom: 2px solid white; >tbody tr < position: relative; >tbody .border < position: absolute; border: 1px solid black; left: 0px; top: 2px; right: 0px; bottom: 2px; display: block; >td
Количество в коробке Штук Килограм 12000 18,48 12000 18,48 12000 18,48 12000 18,48
Убрать внешние границы таблицы
а нужно сделать вот так, т.е. убрать внешнюю окантовку:
_________________________
_________________________
_________________________
_________________________
_________________________
_________________________
Лучшие ответы ( 1 )
94731 / 64177 / 26122
Регистрация: 12.04.2006
Сообщений: 116,782
Ответы с готовыми решениями:
Убрать верхние и нижнии границы таблицы
Подскажите как сделать чтобы у 10-17 не было границ) сверху и снизу <table cellpadding="0".
Как убрать наружные границы вокруг таблицы в HTML
Здравствуйте! Я новичок в сфере HTML, сейчас передо мною стоит задание сверстать сайт с помощью.
Убрать границы в ячейках
Как убрать полностью границы в таблице, чтобы их вообще не было видно <div >
Убрать сдвоенные границы у table
На скрине видно сдвоенные границы. border-collapse пробовал, но толку 0. CSS: td < padding.
3825 / 2675 / 1521
Регистрация: 12.07.2015
Сообщений: 6,672
Записей в блоге: 4
border:0;
Регистрация: 08.10.2012
Сообщений: 266
Сообщение было отмечено mrtoxas как решение
Решение
mrtoxas, 0 убирает не только наружнюю но и внутренние горизонтальные линии
1 2 3 4 5 6 7 8 9 10
TABLE{ width: 1000px; /* Ширина таблицы */ border-collapse: collapse; /* Убираем двойные линии между ячейками */ border: 2px solid white; /* Прячем рамку вокруг таблицы */ } TD, TH { padding: 3px; /* Поля вокруг содержимого таблицы */ border: 1px solid #999999; /* Параметры рамки */ text-align: left; /* Выравнивание по левому краю */ }
3825 / 2675 / 1521
Регистрация: 12.07.2015
Сообщений: 6,672
Записей в блоге: 4
1 2 3 4 5 6 7 8 9 10 11
table { border-collapse: collapse; } tr:not(:last-child){ border-bottom:1px solid red; } td:not(:last-child):not(:first-child), th:not(:last-child):not(:first-child){ border-left:1px solid red; border-right:1px solid red; }
87844 / 49110 / 22898
Регистрация: 17.06.2006
Сообщений: 92,604
Помогаю со студенческими работами здесь
Убрать границы между ячейками
Вы можете изменить фон на цвет, чтобы их увидеть, вообщем — в районе навигации по сайту, видны.
Видны границы у изображения в гугл хром и ИЕ, как их можно убрать?
видно что есть граница, странно, но в firefox, opera и safari такого не наблюдается, че это с ними?
Не отображаются границы таблицы
Всем привет вообщем кое как понял как сделать Ну столкнулся с такой проблемой что ячейки создались.
Границы таблицы в CSS
Убрать границу таблицы не получается в CSS. table td < .
Или воспользуйтесь поиском по форуму:
как убрать границы в html таблице
Здравствуйте. есть сайт написанный в html построен таблицами верхняя горизонтальная и левая вертикальная без ячеек т.е. две рамки. нужно убрать верхнюю и боковые рамки у верхней таблицы. у левой таблицы нужно убрать нижнюю, верхнюю, левую границу. как это сделать. вот код:
Лучший ответ
в теге Table ставишь border=»0″
затем в тегагх ячеек таблици прописываешь стиль.
например: style =»border-left:1px solid #000000;»
border-left — граница слева
border-right — справа
border-top — сверху
border-bootom — снизу
1px — толщена линии
solid — сплошная линия
#000000 — 16-ричный код цвета в формате RGB (#ff0000 — красный)
Остальные ответы
По моему (table border=»0″). В круглых скобках пишется специально, чтобы текст отобразился (т. е. Вы смогли его увидеть) , а не обработался в браузере.