Membuat Gambar Kiri Kanan Sejajar CSS



Membuat Gambar Kiri Kanan Sejajar Css. Xfoost.com – Dipostingan  kali ini Xfoost akan membahas tentang CSS ( Cascading Style Sheet ). apa itu CSS? CSS aturan yang digunakan  untuk mengendalikan beberapa komponen dalam web. Dikatakan juga oleh situs wikipedia bahwa CSS bukan merupakan bahasa pemerograman.

CSS sendiri ada beberapa versi, yaitu CSS1, CSS2, dan CSS3.

Nah Dipostingan kali ini Xfoost akan memberikan tutorial bagaimana Membuat Gambar Kiri Kanan Sejajar CSS. pada beberapa postingan yang lain Xfoost juga pernah membahas tentang Mencegah Dan Memperbaiki Database Down dan juga apabila anda pengguna WordPress maka bisa juga membaca Mencegah Duplicate Meta Title di WordPress.

Oke sekarang kita langsung menuju tutorial. berikut kodenya


.belakang {

Background: #fff;

height: 300px;

widht: 900px;

}

Penggunaan kode diatas digunakan untuk latar belakang. penjelasanya yaitu untuk warna background putih, dengan tinggi 300px dan lebar 900px.

dan sekarang kode selanjutnya..


.gambarkiri {

display: inline-block;

float: left;
}

kode diatas digunakan untuk gambar sebelah kiri. selanjutnya kode kedua yaitu


.gambarkanan {

display: inline-block;

float: right;

}

untuk kode kedua ini digunakan untuk gambar sebelah kanan.

Selanjutnya sekarang kita masukan kode

<div class="belakang">
<div class="gambarkiri"><img src="url gambar" alt="nama gambar kanan bebas"></div>
<div class="gambarkanan"><img src="url gambar" alt="nama gambar kanan bebas"></div>
</div>

Selanjutnya Save dan coba apakah gambar sejajar yang anda buat berhasil.

Semoga bermanfaat



Indra Bayu

Indra Bayu

Penulis dan Editorial Xfoost.com Email : indrabayu@xfoost.com