Underground404 Sharing

Catatan & Dokumentasi.

Posisi Tengah Menggunakan CSS

Alhamdulillah. Bismillah. Undergrond404 - Posisi Tengah Menggunakan CSS. Masih belum tau maksud judul posting kali ini? huh. Posisi Tengah Menggunakan CSS adalah menengahkan element - element atau daerah - daerah tertentu. Agan pasti tahu kegunaan tag <center/>, hmm.. ini adalah tag penengah menggunakan html. Kalau dipostingan kali ini menggunakan CSS.

Seperti outer-wrapper atau class / id paling luar sebelum body di blog agan. Pasti ada css kayak :

margin:0 auto;
Penjelasan margin :
pemberian jarak antara atau batas antara suatu objek dengan objek-objek yang berada di luar objek tersebut atau pemberian jarak(style) bagian luar pada suatu tag html

mengatur margin berbeda setiap sisi tanpa menggunakan -left / -right atau -top / -bottom, ex:

.target {
  margin:40px 1em 30% 1cm;
}

  • 40px : margin-top (margin pd sisi bagian atas)
  • 1em : margin-right (margin pd sisi bagian samping kanan)
  • 30% : margin-bottom (margin pd sisi bagian bawah )
  • 1cm : margin-left (margin pd sisi bagian samping kiri)
  • kalau auto berada di satu sisi, berarti sesuai keadaan daerah tersebut.

Ohh ia, kok sampe lupa sm topiknya wkwkw. Ini deh caranya :
tambahin css margin:0 auto; ke bagian css yang akan di tengahkan.

Kalau belum bisa, dibagian markup html yang akan ditengahin coba ditambahin tag div yang attributnya style='text-align:center'. Example:

<div style='text-align:center'>
  <img src='.....'/>
</div>

Semoga bermanfaat, Alhamdulillah.