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

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

Вот мой код:

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

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

Спасибо

Ответ 1

Изменить ноябрь 2015: В Foundation 6 выйдите из Помощники по типографии

Редактировать апрель 2014: В Foundation 5 проверьте уроки.

Оригинальный ответ:

Используйте класс текстового центра.

<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

Ответ 2

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

.five.columns.centered

Ответ 3

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

Ответ 4

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

Ответ 5

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