Нельзя использовать отрицательный правый край для элемента таблицы?
Я пытаюсь использовать элементы table-cell в сетке, которая использует отрицательные поля в строках для устранения левого и правого желобов на вложенных элементах сетки. Это отлично работает на элементах с плавающим и встроенным блоками, но элементы с display: table
, соблюдая отрицательное левое поле, игнорируют отрицательное правое поле:
![Table with negative right margin]()
Странно, а? Простая демонстрация: http://jsfiddle.net/57FAN/1/
Все браузеры, похоже, реализовали это так же, к сожалению. Любые идеи?
P.S. Пусть отложите обсуждение по таблицам - * элементов для макета до тех пор, пока не будет стандартизирована гибкая коробка.
Ответы
Ответ 1
Таблица не игнорирует отрицательный запас, но только 100% по ширине и сдвинута на 5 пикселей влево. Вам понадобится "100% + 2 * 5px", чтобы полностью заполнить серое пространство.
Строка не имеет ширины, поэтому используется вся доступная ширина.
Если вы будете использовать
.row {
margin: 0 -5px;
width: 100%;
}
вы увидите, что ширина равна
Ответ 2
В вашем коде больше свойств margin
и padding
. так что это выглядит так. Здесь я исправил некоторые коды.
Fiddle DEMO