сетка мелких блоков не центрирует большие пальцы должным образом

Question

у меня есть 3 больших пальца, которые я хочу расположить по центру подряд.Код

    <div class="large-12 columns">
    <ul class="small-block-grid-3">
      <li><img class="shadow" src="img/thumbs/carWashHome.jpg"></li>
      <li><img   class="shadow" src="img/thumbs/homeCleanHome.jpg"></li>
      <li><img   class="shadow" src="img/thumbs/carpetCleanHome.jpg"></li>
    </ul>
  </div>

Но почему-то большие пальцы начинаются слева, а не по центру.Можете ли вы подсказать, как это исправить.вот картинка

Вот ссылка СВЯЗЬ

Вы можете видеть, что большие пальцы смещены влево.как их центрировать.Спасибо.

Answer 1

Замените строку следующим образом

<div class="large-12 columns" style="text-align: center;">

. Ключ

должен добавить генеракодицетагкод и задачу будет исправлено

Answer 2

Спасибо за публикацию URL.

Просто добавь text-align:center; в вашей .small-block-grid-3 > li{}

Пожалуйста, дайте мне знать, если у вас есть проблемы.

CSS

.small-block-grid-3 > li{
    text-align:center;
}

Answer 3

Добавьте этот CSS в теги изображений:

display: block;
margin-left: auto;
margin-right: auto;

Это выровняет изображение по center присутствует в li ярлык.

Answer 4

Может быть приятно знать, что фонд также имеет класс CSS под названием «Text-Center», который может быть применен к элементам по мере необходимости: -)

<div class="text-center">
content goes here...
</div>

.