Один див почему то кушает следующий и располагает его справа а не внизу.?

Question

[Евгений Полинов]

<div class="second_section">
        <div class="container second_section">
            <div class="second_section__title title">
                <h2><strong>Программа профессиональных тренингов позволит освоить практические навыки гештальт-терапии</strong></h2>
            </div>
            <div class="second-section__title2 title_too">
                <h2>Это прекрасная возможность<br> начать психологическую <br> практику</h2>
            </div>
            <div class="second_section__nav nav-conteiner">
                <div class="nav-conteiner__list-item list-item">
                    <h2 class="nav-conteiner__title"><strong>Продолжительность курса</strong></h2>
                    <p>18 учебных модулей <br> Начало первого модуля <br> февраль 2023 года</p>
                </div>
                <div class="nav-conteiner__list-item list-item">
                    <h2 class="nav-conteiner__title"><strong>Форма обучения</strong></h2>
                    <p>Очно-заочная <br> Очная: Психологический центр “Феникс” (г.Нижний Новгород, ул. Трудовая, д.8) <br> Заочно: Онлайн встречи в Zoom</p>
                </div>
                <div class="nav-conteiner__list-item list-item">
                    <h2 class="nav-conteiner__title"><strong>Цели</strong></h2>
                    <p>Цель: Освоение метода гештальт-терапии <br> согласно мировым стандартам</p>
                </div>
                <div class="nav-conteiner__list-item list-item">
                    <h2 class="nav-conteiner__title"><strong>Задачи</strong></h2>
                    <p>Изучить необходимые методы гештальт-терапии. <br> Овладеть умениями проводить консультации в гештальт-подходе <br> Освоить практические навыки необходимые для ведения частной практики</p>
                </div>
            <div>           
            <div class="second_section__program program">
                <!-- должен быть снизу а почему то остается справа (при чем в предыдущем диве)  -->
            </div>
        </div>
    </div>

<

.second_section
    background: #E3E3E3

.title
    width: 1024.54px
    height: 117.89px
    margin-bottom: 28px
    margin-left: 80px
    h2
        font-size: 40px
        line-height: 47px
        text-align: center
        color: #000000
.title_too
    width: 492px
    height: 130px
    margin-left: 340px
    margin-bottom: 90px
    h2
        text-align: center
        font-size: 32px
.nav-conteiner
    display: inline-flex
    &__list-item
        width: 270px
        height: 192px
        margin-right: 14px
        background: linear-gradient(180deg, #B1CB1C 0%, rgba(208, 211, 207, 0.5) 100%)
        text-align: center     
    &__title
        font-size: 24px
        margin-bottom: 30px
.list-item
    &:hover
        transition: 1s
        transform: scale(1.2)
.program
    height: 200.89px
    border: 2px solid #000

как будто он часть нав контейнера

Answer 1

[SunUp]

У вас не закрыт блок

<div class="second_section">
        <div class="container second_section">
            <div class="second_section__title title">
                <h2><strong>Программа профессиональных тренингов позволит освоить практические навыки гештальт-терапии</strong></h2>
            </div>
            <div class="second-section__title2 title_too">
                <h2>Это прекрасная возможность<br> начать психологическую <br> практику</h2>
            </div>
            <div class="second_section__nav nav-conteiner">
                <div class="nav-conteiner__list-item list-item">
                    <h2 class="nav-conteiner__title"><strong>Продолжительность курса</strong></h2>
                    <p>18 учебных модулей <br> Начало первого модуля <br> февраль 2023 года</p>
                </div>
                <div class="nav-conteiner__list-item list-item">
                    <h2 class="nav-conteiner__title"><strong>Форма обучения</strong></h2>
                    <p>Очно-заочная <br> Очная: Психологический центр “Феникс” (г.Нижний Новгород, ул. Трудовая, д.8) <br> Заочно: Онлайн встречи в Zoom</p>
                </div>
                <div class="nav-conteiner__list-item list-item">
                    <h2 class="nav-conteiner__title"><strong>Цели</strong></h2>
                    <p>Цель: Освоение метода гештальт-терапии <br> согласно мировым стандартам</p>
                </div>
                <div class="nav-conteiner__list-item list-item">
                    <h2 class="nav-conteiner__title"><strong>Задачи</strong></h2>
                    <p>Изучить необходимые методы гештальт-терапии. <br> Овладеть умениями проводить консультации в гештальт-подходе <br> Освоить практические навыки необходимые для ведения частной практики</p>
                </div>
            <div>  <!-- Тут видимо должен быть закрывающий тег -->         
            <div class="second_section__program program">
                <!-- должен быть снизу а почему то остается справа (при чем в предыдущем диве)  -->
            </div>
        </div>
    </div>

Comments

[Евгений Полинов]

мне стыдно...
знали бы сколько раз я уже все это перепроверил
поспать просто над
СПАСИБО!