Zebra temel merkezi içeriği ızgarada

Question

Yatay olarak bir görüntüyü zahmetli bir sütuna ortalamak istiyorum ama imkansız görünüyor. Her şeyi denedim, heryerde aradım ama işe yaramayacağım.

İşte benim kodudur:

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

halen manzara görüntüleri 12 sütun ızgarada tamam, ama bir portre görüntüyle karşımıza çıktığında ızgaranın sol tarafındadır. Eğer% 25'lik bir dolgu verip merkeze giderse, ama tüm görüntüleri bir klasörden çekmek ve sitedeki kodu oluşturmak için php kullanıyorum, bu yüzden tüm resimlerde% 25 dolgu yapamıyorum. manzaralar küçülüyor).

Teşekkürler

Answer 1

: Vakfı 6 kontroller sırasında dışarı Typography Helpers

---

Düzenleme Nisan 2014: Kuruluş 5 check out Utility classes yılında.

---

Orjinal cevap:

metin merkezli sınıfını kullanın.

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

Kaynak: vakıf 4 Kullanılması https://github.com/zurb/foundation/pull/224

Answer 2

Ortalanmış sınıfı eklemeyi deneyin. Düzenleme Kasım 2015

.five.columns.centered 

Answer 3

:

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; } 

Answer 4

ben bir görüntü merkezli olsun tek yolu Founda 4 görüntülenecek şekilde değişecektir: blok; ekran yerine img için: satır içi blok;

Answer 5

Sadece "text-center" sınıfını ekleyin