There are several ways to center a div horizontally and vertically with CSS:

1.container { 
2  display: flex; 
3  justify-content: center; 
4  align-items: center; 
5} 

In this example, the property of the container is set to , which allows us to use the and properties to center the child elements both horizontally and vertically.

1.container { 
2  display: grid; 
3  place-items: center; 
4} 

In this example, the property of the container is set to , and the property is used to center the child elements both horizontally and vertically.

1.container { 
2  position: relative; 
3} 
4 
5.centered-div { 
6  position: absolute; 
7  top: 50%; 
8  left: 50%; 
9  transform: translate(-50%, -50%); 
10} 

In this example, we've used a parent container with to position the child div with . We've set the and properties of the child div to , and then used to center it. Keep in mind that the third method requires the div to have a fixed width and height. If your div's dimensions are dynamic, you might need to use a different approach.