我正在尝试将div
width
和height
设置为auto
,使其在屏幕上居中,垂直和水平。这是我目前所做的CSS,请任何帮助。
#popup {
position: absolute;
margin: auto;
height: auto;
width: auto;
display: table;
padding: 10px;
max-width: 650px;
top: 0;
bottom: 0;
left: 0;
right: 0;
}
答案 0 :(得分:2)
你可以这样做:
<强> CSS 强>
#popup {
position: absolute;
margin: auto;
font-family:Segoe, "Segoe UI", "DejaVu Sans", "Trebuchet MS", Verdana, sans-serif;
height: auto;
width: auto;
display: table;
padding: 10px;
max-width: 650px;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
}
<强> DEMO HERE 强>
答案 1 :(得分:0)
试试这个https://jsfiddle.net/2Lzo9vfc/13/
HTML
<div class="page">
<div class="content">
<div class="div">
<p>THIS IS CONTENT</p>
</div>
</div>
</div>
CSS
.page {
height: 100vh;
width: 100%;
display: table;
}
.content {
display: table-row;
}
.div {
text-align: center;
display: table-cell;
vertical-align: middle;
}