Прошу помощи в верстке блока

[Erema]

Добрый день, товарищи! 

 

Прошу, подскажите, пожалуйста, как правильно сверстать вот такой блок

Я все картинки поместила в блоки с float:left и тут встала. Слова-то получаются шире картинок. Прошу подсказки!

[Yazon_Nile]

display: inline-block
и слова переносить в ручную через br

[Switch74]

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

[Erema]

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

А как стрелки тогда реализовывать? они же тоже картинкой. Получается они тоже блоком. И это будет два разных блока

 

Сейчас у меня сделано пока так. Совсем не понимаю, как стрелки эти реализовать((

<div class="icon clearfix"><div class="fl"><img src="/images/phone.png" alt=""> <span>Позвоните или закажите онлайн</span></div><div class="fl"><img src="/images/passport.png" alt=""><span>Предоставьте пасспорт</span></div><div class="fl"><img src="/images/cash.png" alt=""><span>Оплатите аренду</span></div><div class="fl"><img src="/images/auto.png" alt=""><span>Получите автомобиль</span></div></div>

 

.icon .fl {width: 25%;text-align: center;float:left}

display: inline-block
и слова переносить в ручную через br

А слова же тогда окажутся в блоке с картинкой. например, телефоном. Ширина картинки с телефоном и слова расходятся. А стрелки должны начинаться сразу от картинки... Вот как сделать? У меня пока в голове только один вариант - все блоки с фиксированной высотой/шириной сделать и слова сделать блоком отдельным. Но это крайний случай...

[Switch74]

стрелки можно сделать фоном или z-index меньше чем у картинок, текст и должен быть в блоке с картинкой, это им не будет мешать

[Sergik+]

Стрелки можно добавить через :after.

[Erema]

стрелки можно сделать фоном или z-index меньше чем у картинок, текст и должен быть в блоке с картинкой, это им не будет мешать

Спасибо за совет!!! Буду делать фоном. 

 

Стрелки можно добавить через :after.

Спасибо, что не оставили в беде) Но не получилось через after