Menengahkan Blok (DIV) di CSS

  • acepsdr

    (@acepsdr)


    15 years, 4 months yang lalu

    Saya lagi coba desain theme sendiri. Misalkan saya ada definisikan DIV dengan lebar 300px. Kalau dengan di css cuma didefinisikan dengan “width: 300px;”, maka blok DIV tersebut ditampilkan secara “Left”.

    Saya mau di tampilkannya di tengah2 layar seperti ilustrasi berikut ini:

    Left Margin (%)<div width=300px>….</div>Right Margin (%)

    syntax CSS-nya bagaimana ya?

    Thanks,

    Acep Sudrazat
    http://www.berburuduit.com

Melihat 3 balasan - 1 sampai 3 (dari total 3)
  • Moderator Huda Toriq

    (@hudatoriq)

    15 years, 4 months yang lalu

    <div class="container">
    <div class="content">
    .....
    </div>
</div>

    Stylesheet:

    .container {
    width: 1000px;
    ........
}
.content {
    width: 300px;
    margin-left: auto;
    margin-right: auto;
}

    Pada contoh di atas, div.content akan diletakkan di tengah-tengah dari kontainer selebar 1000px. Intinya, margin kiri dan kanan dibuat auto, dan pastikan elemen induknya punya lebar yang mencakup ujung kiri dan kanan area yang menjadi acuan “tengah”.

    Pencetus Utas acepsdr

    (@acepsdr)

    15 years, 4 months yang lalu

    Thanks pak huda. Tapi kenapa ya kalau di IE tidak berfungsi, sementara di browser lain (saya coba pakai safari) scriptnya berfungsi tampil di tengah2?

    Pencetus Utas acepsdr

    (@acepsdr)

    15 years, 4 months yang lalu

    Eh sory sudah bagus/berfungsi sekarang. yang container saya tambahkan “text-align: center;”

Melihat 3 balasan - 1 sampai 3 (dari total 3)
  • Topik ‘Menengahkan Blok (DIV) di CSS’ tertutup untuk balasan baru.