我的CSS是:
#login, #addItemContainer, #searchDialog, #createBill, #createExpense, #editItemContainer, #reloadBill {
position: absolute;
top:0;
bottom: 0;
left: 0;
right: 0;
margin: auto;
padding: 10px;
background-color: rgba(255,170,107,0.8);
text-align: center;
}
#addItemContainer, #editItemContainer {
width: 405px;
height: 700px;
position: fixed;
}
这导致了令人满意的结果:
但是,当动态生成验证消息时,这将不起作用。高度也需要动态增加。设置height: auto
会导致它占据浏览器的整个高度。
即使应用min-width: 700px
也会导致上述情况。我该怎么办?
请注意,我必须使用绝对位置和接下来的几行来确保对话框在垂直和水平方向都居中。