0

Есть 10 блоков, в каждом из них есть картинка. Как выровнять их внутри его родителя так, что бы блоки делились поровну. введите сюда описание изображения

<div class="tour-list-content">
                    <div class="first-list-image">
                        <div class="image img1">
                            <div class="image-content">
                                <span>Russian</span>
                            </div>
                        </div>
2
  • Блоки должны делиться поровну в определнном кол-ве на строку? Или они должны занимать одинаковое пространство? Напишите подробнее, чтобы решить вашу задачу. 12 авг 2019 в 13:22
  • Да, блоки делятся поровну, и занимают одинаковое пространство
    – HERO NAX
    13 авг 2019 в 9:44

1 ответ 1

-1
Решил я вот таким способом, но возможно есть другой, чему я буду рад

    .first-screen .container .tour-list .image{
    	width: 100px;
    	height: 70px;
    	flex-basis: 110px;
    }
    .first-screen .container .tour-list .tour-list-content .first-list-image{
    	padding: 0 40px;
    	display: flex;
    	justify-content: space-between;
    }
    .first-screen .container .tour-list .tour-list-content .second-list-image{
    	margin-top: 55px;
    	padding: 0 40px;
    	display: flex;
    	justify-content: space-between;
    }
    <div class="tour-list">
        <div class="paragraph-content">
            <span>places you must visit in your life</span>
        </div>
        <div class="tour-list-content">
            <div class="first-list-image">
                <div class="image img1">
                    <div class="image-content">
                        <span>Russian</span>
                    </div>
                </div>
                <div class="image img2">
                    <div class="image-content">
                        <span>Ukraine</span>
                    </div>
                </div>
                <div class="image img3">
                    <div class="image-content">
                        <span>New-York</span>
                    </div>
                </div>
                <div class="image img4">
                    <div class="image-content">
                        <span>China</span>
                    </div>
                </div>
                <div class="image img5">
                    <div class="image-content">
                        <span>Kazakhstan</span>
                    </div>
                </div>
            </div>
            <div class="second-list-image">
                <div class="image img6">
                    <div class="image-content">
                        <span>Dagestan</span>
                    </div>
                </div>
                <div class="image img7">
                    <div class="image-content">
                        <span>Japan</span>
                    </div>
                </div>
                <div class="image img8">
                    <div class="image-content">
                        <span>USA</span>
                    </div>
                </div>
                <div class="image img9">
                    <div class="image-content">
                        <span>Canada</span>
                    </div>
                </div>
                <div class="image img10">
                    <div class="image-content">
                        <span>Belarus</span>
                    </div>
                </div>
            </div>
        </div>
        <div class="line-bottom">

        </div>
    </div>

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.