Чид Div с абсолютным позиционированием Overlaps Содержание в родительском

Question

В этом WordPress site. У меня есть дочерний div внутри родителя со следующими стилями, который заставляет его иметь полную ширину браузера, даже если родительский элемент имеет заданную центральную ширину. Следующие стили ребенка

.slider-controller 
{ 
position: absolute; 
width: 100%; 
left: 0; 
right: 0; 
top: 100; 
} 

У меня есть плагин под названием Metaslider, который печатает полный браузер ширина слайд-шоу внутри этого ребенка дел. Проблема возникает, когда я размещаю содержимое в родительском div. Переменная высота ребенка перекрывает содержимое родителя при изменении ширины браузера. Как вы относитесь к тому, чтобы этот контент оставался ниже ребенка независимо от ширины браузера? Я ценю любые мысли, которые вы можете иметь по этому поводу.

Answer 1

я не смог точно определить, что высота слайд-шоу, но так как:

• вы хотите, первый абзац в <main> всегда начинаются чуть ниже слайд-шоу
• слайд-шоу имеет постоянный относительно высота (по отношению к области просмотра ширина)

следующее объявление стиля - с помощью окна просмотра ширина блоков (vw) - учитываются оба эти соображения:

main p:first-of-type {margin-top: 48vw;}