Memusatkan elemen di tengah halaman adalah salah satu tugas yang paling sering dilakukan dalam desain web.
text-align: center; pada elemen induk untuk memusatkan teks dan gambar inline.margin: auto; pada elemen block dengan lebar tetap.display: flex; justify-content: center; align-items: center;.<!DOCTYPE html>
<html>
<head>
<style>
.wadah-tengah {
display: flex;
justify-content: center;
align-items: center;
height: 140px;
background: #0d2e5c;
border-radius: 12px;
}
.isi-tengah {
background: #fca311;
color: #0d2e5c;
padding: 12px 24px;
border-radius: 20px;
font-weight: bold;
}
</style>
</head>
<body>
<div class="wadah-tengah">
<div class="isi-tengah">Tepat di Tengah Sempurna!</div>
</div>
</body>
</html>Kombinasi justify-content: center; align-items: center; pada container flex adalah cara paling modern dan mudah untuk memusatkan konten.
Cara paling modern dan ringkas untuk memusatkan elemen baik secara vertikal maupun horizontal adalah menggunakan?