[CSS] centering on the screen

programming web dev
1

if I have a DIV that’s 400px by 200px, how do I center it on the screen? When I try to do the following, it only centers the top left corner on the screen. I want the exact center of the DIV to be centered.


#box {
   width: 400px;
   height: 200px;
   position: absolute;
   top: 50%;
   left: 50%;
}