содержание центра центра zurb в сетке

Question

Я пытаюсь центрировать горизонтально изображение в колонку zurb, но это кажется невозможным. Я пробовал все, искал везде, но я не могу заставить его работать.

Вот мой код:

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

в настоящее время ландшафтных изображений в порядке на сетке 12 столбцов, но когда портретное изображение идет вдоль него на левой стороне сетки. Если я даю ему 25% отступов, он попадает в центр, но я использую php, чтобы вытащить все изображения из папки и генерировать код «на лету», поэтому я не могу иметь 25% отступов на всех изображениях (пейзаж сжимается).

Thanks

Answer 1

Редактировать ноябрь 2015: В фонде 6 чека из Typography Helpers

---

Редактировать апреля 2014: В фонд-заканчивал 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

Answer 2

Попробуйте добавить центрированный класс.

.five.columns.centered 

Answer 3

Используя основание 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; } 

Answer 4

Единственный способ, которым я могу получить изображение по центру Найти 4 следует изменить для отображения: block; для img вместо отображения: inline-block;

Answer 5

Просто добавьте класс «text-center»