Cara Centerkan DIV dalam HTML 14/11/2018

Adakah anda mengalami masalah untuk ketengahkan elemen DIV di dalam layout?

 

Elemen DIV adalah display BLOCK

Pada asasnya, setiapkali elemen DIV dibuat, ia mempunyai CSS attribute display:block . Jadi, kita boleh tukarkan styling dia kepada display:inline. Tapi, kita perlu tambah satu lagi DIV diluar sebagai wrapper dan setkan styling wrapper ini text-align:center

 

Langkah Pertama

<div id="ketengahkan" style="display:inline-block;">
    ini adalah div
</div><!-- #ketengahkan -->

 

Langkah Terakhir

<div id="wrapper" style="text-align:center;">
    <div id="ketengahkan" style="display:inline-block;">
        ini adalah div
    </div><!-- #ketengahkan -->
</div><!-- wrapper -->

 

Hasilnya

inilah hasilnya

 

 

Selamat mencuba!