Free Glosarium Online Indonesia

halo lagi, sekarang saya mau share cara membuat kolom pada web / blog / wap, tapi sebenarnya bukan itu yang lagi mau dibahas hehe.

lebih tepatnya saya lagi pingin ngebahas apa itu fungsi dari kode css float pada halaman html.

menurut saya fungsinya sama seperti kita membuat kolom table atau memakai kode position. hanya saja kode ini lebih simple (menurut saya, hehe).

saya baca kode ini dari www.quackit.com

kode

<style type="text/css">
.kelas {
float: left; width: 100px;
}
</style>

atribut yang bisa dipakai
left (ini agar posisi float berada di sebelah kiri)
right (posisi float berada disebelah kanan)
none (tidak memakai float)

lalu bagaimana cara menggunakanya?

yap ini memang agak sulit untuk saya jadikan teori, karena lebih enak sambil praktek (apa yang kamu lihat itu yang kamu dapat, hehe).

tapi tenang saya kasih sedikit contoh kecilnya

kita akan membuat 2 kolom menggunakan float ini

ini kodenya :

<div style="width: 300px; height: 200px;">

<div style="float: left; width: 80px; background: #ff0;">kode dan konten</div>

<div style="float: right; width: 80px; background: #f0f;">kode dan konten</div>

<div style="float: right; width: 140px; background: #0ff;">Kode dan konten </div>

</div>


<div style="width: 300px; height: 200px;"> <div style="float: left; width: 80px; background: #ff0;">float: left;</div> <div style="float: right; width: 80px; background: #f0f;">float: right;</div> <div style="float: right; width: 140px; background: #0ff;">float: none;</div> </div>