网格中的zurb基础中心内容 [英] zurb foundation center content in the grid

问题描述

我正在尝试将图像水平居中到zurb列中，但这似乎是不可能的。我尝试了所有内容，到处搜索，但是无法正常工作。

I'm trying to center horizontally an image into a zurb column but it seems impossible. I tried everything, searched everywhere, but I cant get it to work.

这是我的代码：

<div class="row">
    <div class="twelve columns"><br />
        <img src="img_06.jpeg" alt="slide image">
    </div>
</div>

目前12列网格上的风景图像还不错，但是当出现肖像图像时，网格的左侧。如果我给它25％的填充，它会居中，但是我正在使用php从文件夹中提取所有图像并即时生成代码，因此我无法对所有图像添加25％的填充（

currently landscape images are alright on the 12 column grid, but when a portrait image comes along it is on the left side of the grid. If i give it a 25% padding it goest to the center, but I'm using php to pull all the images from a folder and generate the code on the fly, so i can't have 25% padding on all the images (landscape ones shrink).

谢谢

推荐答案

编辑2015年11月：在Foundation 6中，查看版式助手

Edit November 2015: In Foundation 6 check out Typography Helpers

编辑2014年4月：在Foundation 5中签出实用程序类。

Edit April 2014: In Foundation 5 check out Utility classes.

原始答案：

使用文本中心类。

<div class="row">
    <div class="twelve columns text-center"><br />
        <img src="img_06.jpeg" alt="slide image">
    </div>
</div>

来源： https://github.com/zurb/foundation/pull/224

这篇关于网格中的zurb基础中心内容的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！