1. margin: auto;

   özelliği ile: Görsel bir blok elemanı haline getirilir ve sol ve sağ kenar boşlukları otomatik olarak ayarlanır 12.

img {
  display: block;
  margin-left: auto;
  margin-right: auto;
}
Kopyala

2. position: absolute;

   ve

   transform: translate(-50%, 0);

   ile: Görsel, ekranın ortasına yerleştirilir 1.

.box {
  position: absolute;
  left: 50%;
  transform: translate(-50%, 0);
}
Kopyala

3. display: grid;

   ve

   place-items: center;

   ile: Görsel, bir grid yapısı içinde merkeze yerleştirilir 1.

.container {
  display: grid;
  place-items: center;
}
Kopyala