Cara Membuat 3 Box Dalam 1 Baris Menggunakan CSS

Cara Membuat 3 Box Dalam 1 Baris Menggunakan CSS

HobbyTekno - Pada Postingan kali ini saya akan memberikan tutorial bagaimana Cara Membuat 3 Menu Box Dalam 1 Baris Menggunakan CSS, Membuat 3 Box dalam 1 baris hanya degan menggunakan CSS saja termasuk sangat simple. Supaya baris Boxnya berbaris kekanan, beri style display inline-block. Jika box tadi tidak diberikan style display inline-block, maka box akan ditampilkan berbaris kebawah. Langsung saja simak langkah-langkahnya.

Langkah-Langkah Membuat 3 Box Dalam 1 Baris Menggunakan CSS


1. Salin kode dibawah ini :

<!DOCTYPE html>
<html>
<head>
<title>3 Menu Box dalam 1 Baris</title>
<style>
.box{
width:300px;
height:300px;
background:red;
display: inline-block;
margin-left: 10px;
}
</style>
</head>
<body>
<div class="box"></div>
<div class="box"></div>
<div class="box"></div>
</body>
</html>

2. Kode diatas Jika kita buka di Browser maka hasilnya akan seperti berikut :


Anda bisa mengembangkan kode diatas sesuai kebutuhan.

Sekian Cara Membuat 3 Box Dalam 1 Baris Menggunakan CSS, semoga postingan Admin kali ini bermanfaat untuk anda. Jika ada kendala tanyakan saja pada komentar

No comments for "Cara Membuat 3 Box Dalam 1 Baris Menggunakan CSS"