gpt4 book ai didi

javascript - CSS float 弹出窗口 : Tricky CSS Positioning

转载 作者:行者123 更新时间:2023-11-27 22:31:47 26 4
gpt4 key购买 nike

我有一个网站,点击链接后会生成一个 div。

请允许我更深入地解释一下。我的 CMS 中有一个“页面”表,并且我添加了通过一个小弹出 div 添加新页面的功能。

我的弹出式 div 定义在表格下方,但是 style="display:none"所以它不会出现在页面上。单击“添加新页面”按钮后,我的 javascript 函数会触发:

document.getElementById("addPage").style.display="block";

这允许 div 在调用时神奇地出现。

但是,这是我的问题;我希望这个 div 始终显示在中央,但我的标准 margin:auto 不允许它使 div 居中,因为它仍然出现在表格下方(尽管右/左居中且 z-index:999)。

这是我的 CSS 代码:

#addPage{
width:250px;
height:180px;
background-color:#FFFFFF;
border:1px #000000 solid;
position:absolute;
z-index:999;
padding:10px;
}

最佳答案

因为你想垂直和水平居中,你可以使用dead centre technique .它使用绝对定位将已知宽度/高度的元素放在屏幕中央。

如果叠加层的尺寸是动态的,您只需运行一些 javascript 来确定其宽度/高度,然后再显示它。

关于javascript - CSS float 弹出窗口 : Tricky CSS Positioning,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/3555349/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com