put DIV in the center of the page [duplicate]

Question

put DIV in the center of the page [duplicate]

Navigation

#1 by (3 votes)

1

How do I get this 'div' to be in the center of the page?

.dialogbox { 
position: absolute;
top: 30px;
width: 550px;
border-radius: 4px;
background: #FFFFFF;
margin: auto auto;
overflow: hidden;
display: none;
z-index: 9999;
}

I need to keep the properties' position: absolute; top: 30px; ', as it will appear above other divs, and with a margin at the top of 30px;

css

asked by anonymous 19.12.2016 / 18:55

1 answer

Calling an AccountController function Error while running program

score 3 · Accepted Answer

Try this:

.dialogbox { 
  position: absolute;
  top: 30px;
  left: calc(50vw - 275px);
  width: 550px;
  border-radius: 4px;
  background: #FFFFFF;
  margin 0;
  overflow: hidden;
  z-index: 9999;
  
  background: red;
  min-height: 200px;
}

<div class="dialogbox"></div>