Для цикла, чтобы положить изображения рядом

Question

Хорошо, я пытался решить это, но тоже не смог.У меня есть цикл, который захватывает изображения, но они вертикальные.Я хотел бы их рядом.Я не знаю, что делать.У меня есть это в боковой панели.

<div class="socialGroup">
    <xen:include template="cz_groups_group_title" />
</div>

</xen:foreach>

Answer 1

Вы можете сделать это с помощью css.Добавьте ul в класс социальной группы, затем li в заголовок группы и стилизуйте их, используя cssВы можете установить ширину и высоту li.

<div class="socialGroup">
  <ul>
     <li><xen:include template="cz_groups_group_title" /></li>
  </ul>
</div>

</xen:foreach>

Answer 2

См. Приведенную ниже скрипку для HTML-структуры и правил Css для 5 изображений в 1 строке.

Скрипка: http://jsfiddle.net/2fcfj/

Демо: http://jsfiddle.net/2fcfj/embedded/result/