Как сделать, что бы точки в слайдере меняли высоту с контентом?

Question

[bazliiii]

У меня есть слайдер и в нем текст. Выставил точки через absolute и все выглядит прекрасно до тех пор пока не меняется количество контента.
Вот стили точек:

.slick-dots{
            display: flex;
            position: absolute;
            align-items: flex-end;
            text-align: center;
            left: 0; right: 0;
            bottom: 46px;
            z-index: 1;
        }

Вот скрин с проблемой:

Скрин как должно быть ( это при идеальном размещение текста )

Если что-то еще добавить нужно пишите

Comments

[Anonymous Penguin]

Просьба - прикреплять картинки непосредственно к вопросу

[bazliiii]

Anonymous Penguin, Прикрепил

Answer 1

[bazliiii]

В общем я понял , что написать оболочку ( белый контейнер ) в slider-item и поэтому она скакала в зависимости от слайда, что бы это исправить просто перенес оболочку белую с slider-item в slider-items , таким образом оболочка выставляется размером не зависимо от контента слайда ( ставится от самого большого контента ) и dots выравнивается по нем
Было:

&__items{
           Пустота
        }
        &__item{
            max-width: 310px !important;
            display: block !important;
            position: relative;
            z-index: 2;
            margin: 15px auto;
            background: #FFFFFF;
            box-shadow: 0px 0px 14px 4px rgba(0, 0, 0, 0.12);
            border-radius: 4px;
            padding: 45px 29px 90px 29px;
        }

Стало:

&__items{
            max-width: 310px !important;
            margin: 15px auto;
            background: #FFFFFF;
            box-shadow: 0px 0px 14px 4px rgba(0, 0, 0, 0.12);
            border-radius: 4px;
            padding: 45px 29px 90px 29px;
            z-index: 2;
        }
        &__item{
            max-width: 310px !important;
            display: block !important;
            position: relative;
            z-index: 2;
        
        }