父亲的绝对定位重叠内容的Chid Div

Question

通过以下WordPress site。我有一个父级内的子div与以下样式强制它到浏览器的全部宽度，即使父级具有定义的居中宽度。以下是孩子的风格

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

我有一个叫Metaslider插件，打印完整的浏览器的宽度这个孩子DIV中的幻灯片。当我在父div中放置内容时发生问题。当浏览器宽度被修改时，子级的变量高度与父级内容重叠。无论浏览器的宽度如何，您如何将这些内容留在孩子的下方？ 我很欣赏你对此的任何想法。

Answer 1

我无法准确地确定幻灯片高度是什么，但自从：

• 要在<main>第一段总是开始只是在幻灯片
• 幻灯片下面有一个相对一致的高度（相对于视口宽度 ）

以下样式声明 - 使用视口宽度单位（vw） - 将这两个考虑因素考虑在内：

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