A
A
AhmedGasem2016-10-25 15:36:24
css
AhmedGasem, 2016-10-25 15:36:24

How to attach :after to multiple blocks at once?

I want to attach these arrows to the blocks
It should turn out like this:
dbc6aa698a4945069c0889ddd86a5b24.jpg
But it turns out this
9733a299c79549fba312d2b4cd1f243f.jpg
Please help me figure out what's wrong

<h2 class="col-lg-12 col-md-12 col-sm-12 col-xs-12" style="text-align:center;padding-bottom:50px;" class="col-lg-12 col-md-12 col-sm-12 col-xs-12">Как мы работаем</h2>
        <div class="how-working col-lg-3 col-md-3 col-sm-3 col-xs-12">
            <img src="css/images/telephone.png" width="100px" height="100px">
            <p>Оценка проблемы</p>
        </div>
        <div class="how-working col-lg-3 col-md-3 col-sm-3 col-xs-12">
            <img src="css/images/copy-document.png" width="100px" height="100px">
            <p>Заключаем договор</p>
        </div>
        <div class="how-working col-lg-3 col-md-3 col-sm-3 col-xs-12">
            <img src="css/images/ruble.png" width="100px" height="100px">
            <p>Оплата счета</p>
        </div>
        <div class="how-working col-lg-3 col-md-3 col-sm-3 col-xs-12">
            <img src="css/images/travelling.png" width="100px" height="100px">
            <p>Выезд специалиста</p>
        </div>
        <div class="how-working col-lg-4 col-md-4 col-sm-4 col-xs-12">
            <img src="css/images/shield.png" width="100px" height="100px">
            <p>Работа специалиста</p>
        </div>
        <div class="how-working col-lg-4 col-md-4 col-sm-4 col-xs-12">
            <img src="css/images/home.png" width="100px" height="100px">
            <p>Сдача обьекта</p>
        </div>
        <div class="how-working col-lg-4 col-md-4 col-sm-4 col-xs-12">
            <img src="css/images/home.png" width="100px" height="100px">
            <p>Выдача сертификата</p>
        </div>

.how-working{
    padding-bottom:30px;
}
.how-working::after{
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 10.5px 0 10.5px 30px;
    border-color: transparent transparent transparent #007bff;
    z-index: 50;
    vertical-align: middle;
}

Answer the question

In order to leave comments, you need to log in

1 answer(s)
A
Alexander, 2016-10-25
@Palehin

Pseudo-elements before and after do not work without specifying a property: content: '';

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question