zurb基金會在網格中心的內容

我想水平居中一個圖像到一個zurb列，但它似乎不可能。我嘗試了一切，到處搜索，但我無法讓它工作。zurb基金會在網格中心的內容

這裏是我的代碼：

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

目前景觀圖像都在12柱網還好，但是當一個人像圖像一起談到是在網格的左側。如果我給它一個25％的填充它去中心，但我使用PHP從一個文件夾中拉出所有圖像，並在飛行中生成的代碼，所以我不能有25％的所有圖像填充（景觀縮小）。

謝謝

2012-08-22 Ando

編輯2015年11月：在基金會6退房Typography Helpers

編輯2014年4月：在基金會5退房Utility classes。

原來的答覆：

使用文本中心級。

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

2013-02-06 21:42:59 NinjaFart

這個答案是最好的，因爲它使用現有的CSS風格。創建一個新課程只是增加膨脹，嘖嘖，哼哼和填充。然後問題就浮現在我的腦海裏，關於文檔在這個「文本中心」類中的位置。也許我錯過了它？ –

+1這是最好的答案，因爲OP詢問了基礎，這個解決方案使用了一個內置的基礎類。 – Brandon

我不確定這是否可用。無論如何，我已經接受了這個作爲正確答案。 – Ando

嘗試添加居中的類。

.five.columns.centered

2012-10-02 22:51:24

我看不到類定義。我想念什麼？ –

這不行！這是中心網格元素，而不是內容本身 - 閱讀這裏http://foundation.zurb.com/docs/grid.php – renathy

使用粉底4：

HTML：

<div class="row"> 
    <div id="wrap-img" class="large-12 columns"><br /> 
     <img src="img_06.jpeg" alt="slide image"> 
    </div> 
</div>

CSS：

#wrap-img img { margin: 0 auto; }

2013-03-07 14:00:11 jvalente

我能得到的圖像爲中心的唯一途徑找一個重點4是改變顯示：塊;對於img而不是display：inline-block;

2013-04-05 20:51:26 user2250677

只需添加類「文本中心」

2013-05-29 20:57:01 Flatron

回答