У меня есть революционный слайдер в качестве фона, и я хочу наложить его на статический div, расположенный по центру слайдера.

Проблема в том, что я не могу отцентрировать этот div. Где я ошибаюсь? Вот страница https://www.visitmontaione.com/wcomm/it/

Вот используемый HTML-код:

    
[rev_slider alias="slider-1"][/rev_slider]
Centered DIV

и css

#barrabookingforhome{
display: flex;
justify-content: center;
align-items: center;
margin: 10px;
background: red;
height: 200px;
width: 100%;
z-index:999;
}

#containersliderhome{
display: flex;
justify-content: center;
align-items: center;
}

Спасибо за помощь.

FBracci

Ответов: 1

Ответы (1)

Вы можете использовать этот CSS для центрирования div на https://www.visitmontaione.com/wcomm/it/. Вам нужно только добавить transform: translateX(-50%) translateY(0); к вашему CSS #barrabookingforhome.

#barrabookingforhome {
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 10px;
    background: red;
    высота: 200px;
    ширина: 100%;
    z-index: 999;
    transform: translateX(-50%) translateY(0);
}

2022 WebDevInsider