I have a div with the following css code:

.popup{
  width: 50%;
  margin: auto;
  display: none;
  animation-name: popup;
  animation-duration: 0.15s;
  position: fixed;
  background-color: #cf5c36;
}

How do I make it centered?

CodePudding user response：

You can set the absolute position and transform it to center

top: 50%;
left: 50%;
transform: translate(-50%, -50%);