Question

我在页面底部有一个div。它不受任何其他div的约束。我如何设法将它与主div对齐，有点偏离中心。并将其放在页面顶部，当页面具有不同的高度且div必须具有z-index：1; 两个div顶部必须对齐，一个不能高于另一个。

html

<body>
    <div id="Main"><div> //Css or html for this div can not be edited
    <div id="Our_hero_div"><div> //This has to be show ontop of main, but a bit off-center
</body>

CSS

#Our_hero_div{
    z-index:1; //this much remain
}
#main {
    margin:auto;
}

Answer 1

如果您无法获得#Our-hero-div div的#main INSIDE，并且如果您无法编辑#main div的CSS，则您的选项会受到限制。你可以尝试给它一个绝对位置，并使用css #main属性将其顶部与top div的顶部对齐。

#Our-hero-div {
    position: absolute;
    top: 1em;   /* assumes the #main div has a margin top of 1em - just match this value to whatever the margin/padding of the #main div has on top */
}

您还需要使用left或right水平放置（对于您所追求的偏离中心的事物）。此解决方案仅在#main div真正位于正文顶部时才有效。如果有其他东西改变高度#main，那么这就会崩溃。

将底部div对齐在嵌套的顶部div上，其中底部div多有z-index：1;

1 个答案: