Sistem grid membagi lebar layar menjadi 12 kolom proporsional (misalnya col-6 = 50%, col-4 = 33.33%).
RWD Grid View
Contoh Kode RWD Grid View:
<!DOCTYPE html>
<html>
<head>
<style>
* { box-sizing: border-box; }
.col-6 { width: 50%; float: left; padding: 15px; }
.col-12 { width: 100%; float: left; padding: 15px; }
.kotak { background: #e0f2fe; padding: 20px; text-align: center; border-radius: 6px; font-family: sans-serif; }
</style>
</head>
<body>
<div class="col-6"><div class="kotak">Kolom Kiri 50%</div></div>
<div class="col-6"><div class="kotak">Kolom Kanan 50%</div></div>
</body>
</html>
Uji dan amati bagaimana deklarasi CSS RWD Grid View mengubah tampilan elemen di atas.