Вертикальный интервал деления - PullRequest
3 голосов
/ 16 августа 2011

Как вы распределяете по горизонтали 3 деления с наименьшим количеством кода?

У меня есть 3 деления, которые имеют один и тот же класс, и мне нужно распределить их горизонтально, с 19 пикселями пространства между каждым делением.

Мое решение в настоящее время состоит в том, чтобы дать первым двум элементам div правое поле в 19 пикселей и назначить отдельный класс для третьего элемента div, который дает ему левое поле в 19 пикселей.

Получаетсяработа сделана, но я чувствую, что может быть лучший способ сделать это.В идеале все 3 элемента div должны иметь одинаковый класс.

Ответы [ 2 ]

7 голосов
/ 16 августа 2011

См .: http://jsfiddle.net/thirtydot/q6Hj8/

.yourDivClass + .yourDivClass {
    margin-left: 19px
}

Использует соседний братский комбинатор для применения margin-left к каждому .yourDivClass, которому предшествует .yourDivClass - другими словами, все, кроме первого.

1 голос
/ 16 августа 2011

Вам нужны только два столбца с правым полем; третий столбец не нуждается в дополнительном поле. Граница добавлена, чтобы вы могли видеть ее на скрипке.

div.hasMargin
{
    margin-right: 19px;
}

div.column
{
    border-color: black;
    border-style: solid;
    border-width: 1px;
    float: left;
}

Вот скрипка

...