Floating CSS

Jika sebelumnya untuk mengatur text/paragraf rata kanan atau kiri kita menggunakan property text-align, namun bagaimana jika yang ingin kita atur rata kiri atau rata kanan adalah elemen HTML?

Floating css

Untuk itu kita dapat menggunakan property float. Nilai yang digunakan yaitu left dan right. Untuk lebih jelasnya sialahkan temen-temen buat file baru dan beri nama floating.html lalu ketikkan kode diabawah ini :
<!DOCTYPE html>
<html>
<head>
<title>Floating</title>
<style type="text/css">
img {
width: 200px;
height: 150px;
padding-right: 10px;
float: left; }
</style>
</head>
<body>
<img src="ijo.png" alt="gambar bacacoding"/>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse
cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non
proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
</p>
</body>
</html>
Hasil Kode diatas adalah seperti berikut:

Floating css

Style diatas akan meratakirikan elemen gambar dan membuat paragraf naik keatas.

Nah Bagaimana…? apakah sekarang kamu sudah mengerti apa itu floating dan cara membuatnya? Mungkin itu saja tulisan yang membahas tentang Floating di CSS, jika terdapat kekurangan ataupun kesalahan dalam penulisan mohon di maafkan dan perbaiki atau lengkapi saja jika terdapat kesalahan. Kalau memang tulisan ini bermanfaat tidak ada salahnya jika men-Sharenya kepada teman kamu yang lain, sekian dan terimakasih.
Previous
Next Post »
Thanks for your comment