#main {
width: 600px;
margin: 0 auto;
}
<div id="main">
Mengatur elemen tingkat blok (atau yang memiliki nilai default block pada properti display), akan mencegah lebar elemen merentang lebar pada sisi kanan dan kiri-nya.
Kemudian, Anda bisa mengatur margin kiri dan kanan dengan nilai auto atau otomatis, agar elemen tersebut terpusat di tengah.
Jika kedua hal tersebut dilakukan, yang terjadi selanjutnya adalah, elemen akan mengambil ukuran lebar (width) yang Anda tentukan. Juga, margin kiri dan kanan elemen akan terbagi dua secara merata, sehingga hal tersebut menyebabkan elemen berada tepat di tengah tampilan.
Setelah Anda melakukan hal tersebut, masih ada lagi masalah yang akan muncul. Yakni, ketika layar browser lebih kecil daripada lebar yang telah di atur pada elemen. Masalah yang akan terjadi adalah, tampilan situs web yang terpotong.
Jika hal itu terjadi, maka Browser akan membantu dengan memberikan fitur Scrollbar horizontal Yang menurut saya tidak efektif.
Yuk ke pembahasan berikutnya.....</div>
Mengatur elemen tingkat blok (atau yang memiliki nilai default block pada properti display), akan mencegah lebar elemen merentang lebar pada sisi kanan dan kiri-nya.
Kemudian, Anda bisa mengatur margin kiri dan kanan dengan nilai auto atau otomatis, agar elemen tersebut terpusat di tengah.
Jika kedua hal tersebut dilakukan, yang terjadi selanjutnya adalah, elemen akan mengambil ukuran lebar (width) yang Anda tentukan. Juga, margin kiri dan kanan elemen akan terbagi dua secara merata, sehingga hal tersebut menyebabkan elemen berada tepat di tengah tampilan.
Setelah Anda melakukan hal tersebut, masih ada lagi masalah yang akan muncul. Yakni, ketika layar browser lebih kecil daripada lebar yang telah di atur pada elemen. Masalah yang akan terjadi adalah, tampilan situs web yang terpotong.
Jika hal itu terjadi, maka Browser akan membantu dengan memberikan fitur Scrollbar horizontal Yang menurut saya tidak efektif.
Yuk ke pembahasan berikutnya.....</div>