Properti Float

Properti float - menentukan blok mengambang yang akan dilalui teks di sekitarnya. Properti float kadang-kadang digunakan bersama dengan properti clear, yang membatalkan pengapungan elemen.

Meskipun awalnya float diciptakan untuk menyisipkan blok yang dikelilingi teks, saat ini properti ini digunakan sangat luas dan dengan cara non-standar untuk membangun tata letak.

Sintaks

selector {
	float: left | right | none;
}

selector {
	clear: both | left | right | none;
}

Nilai untuk float

Nilai	Keterangan
`left`	Blok akan mengambang di kiri, dan teks akan mengelilinginya dari kanan.
`right`	Blok akan mengambang di kanan, dan teks akan mengelilinginya dari kiri.
`none`	Tidak ada pengapungan.

Nilai default: none.

Nilai untuk clear

Nilai	Keterangan
`left`	Membatalkan pengapungan dari kiri.
`right`	Membatalkan pengapungan dari kanan.
`both`	Membatalkan pengapungan dari kiri dan kanan.
`none`	Tidak ada pembatalan pengapungan.

Nilai default: none.

Contoh

Menggunakan float dengan cara non-standar, untuk menempatkan item daftar dalam satu baris:

<ul>
	<li>1</li>
	<li>2</li>
	<li>3</li>
	<li>4</li>
	<li>5</li>
</ul>

li {
	float: left;
	border: 1px solid red;
}

Lihat juga

properti clear,
yang membatalkan float untuk elemen di atasnya