Вертикальный интервал деления
Как вы распределяете по горизонтали 3 деления с наименьшим количеством кода?
У меня есть 3 div, которые имеют один и тот же класс, и мне нужно распределить их по горизонтали с 19 пикселями пространства между каждым div.
Мое решение в настоящее время состоит в том, чтобы дать первым двум элементам div правое поле в 19 пикселей и назначить отдельный класс для третьего элемента div, который дает ему левое поле в 19 пикселей.
Это делает работу, но я чувствую, что может быть лучший способ сделать это. В идеале все 3 делителя должны иметь один и тот же класс.
2 ответа
Смотрите: http://jsfiddle.net/thirtydot/q6Hj8/
.yourDivClass + .yourDivClass {
margin-left: 19px
}
Это использует соседний братский комбинатор, чтобы применить margin-left
каждому .yourDivClass
которому предшествует .yourDivClass
- другими словами, все, кроме первого.
Вам нужны только два столбца с правым полем; третий столбец не нуждается в дополнительном поле. Граница добавлена, чтобы вы могли видеть ее в скрипке.
div.hasMargin { Поля справа: 19 пикселей; } div.column { цвет бордюра: черный; стиль границы: твердый; ширина границы: 1px; плыть налево; }
Вот скрипка