Grid System adalah Grid System di web desain salah satu faktor penting dalam layout website menjadi lebih konsisten, sehingga sangat membantu dalam membuat dan membangun website.
Columns (kolom)
terdapat 16 kolom di semantic UI, dari setiap kolom dapat diatur lebar kolom tersebut. sebagai contoh berikut ini kode untuk 4/4 kolom di semantic UI,
kode diatas membuat 4 kolom yang terdiri dari 4 grid dari masing-masing kolomnya. berikut ini tampilan grid dengan kode diatas.
berikut ini beberapa sifat tambahan tentang kolom di semantic
1. Automatic Flow
Kolom di semantic ui terdapat 16 dan jika suatu saat kita menggunakan lebih dari 16 kolom maka otomatis kolom yang tersebut akan berada dibaris ke 2 padahal kita tidak mendeklarasikan sebuah “row” pada kode tersebut. sebagai contoh perhatikan kode dibawah ini
menghasilkan sebuah kolom yang dapat dilihat digambar berikut ini 4/4 dan 2/8/6
2. Column Content
sytle dari kolom tidak tampil langsung pada kolom tetapi tampil terdapat di element di dalam kolom. hal ini karena kolom telah menggunakan padding disetiap barisnya,.
Rows (baris)
rows merupakan bagian dari kolom dengan bentuk mendatar. row dapat diperjelas dengan nambahkan class “row” di element html, yang biasanya merupakan