使用Foundation将单个行中的多个div居中

时间:2015-08-07 13:30:49

标签: html5 css3 responsive-design zurb-foundation

我在CMS中使用Foundation作为Web项目。 有一个列数为3的内容元素。根据CMS中的数据,有不同数量的元素。让我们假设3或任何其他不均匀的数字。我如何能够在没有完全脱离基金会的情况下将它们排成一排?

example

1 个答案:

答案 0 :(得分:0)

为半柱偏移写了我自己的sass。这很有用。

@media only screen and (min-width: 64.0625em) {
    .large_offset_0_5 {
        margin-left: 100/24 *1%;
    }
    .large_offset_1_5 {
        margin-left: 100/24 * 3%;
    }
    .large_offset_2_5 {
        margin-left: 100/24 * 5%;
    }
    .large_offset_3_5 {
        margin-left: 100/24 * 7%;
    }
    .large_offset_4_5 {
        margin-left: 100/24 * 9%;
    }
}
@media only screen and (min-width: 40.0625em) {
    .medium_offset_0_5 {
        margin-left: 100/24 *1%;
    }
    .medium_offset_1_5 {
        margin-left: 100/24 * 3%;
    }
    .medium_offset_2_5 {
        margin-left: 100/24 * 5%;
    }
    .medium_offset_3_5 {
        margin-left: 100/24 * 7%;
    }
    .medium_offset_4_5 {
        margin-left: 100/24 * 9%;
    }
}