# 053: Kolom Responsif untuk Galeri - Trik CSS

Daftar Isi

Kami menambahkan beberapa responsivitas ke grid yang telah kami siapkan untuk Galeri. Pada layar terluas, kami mengaturnya di empat kolom. Kemudian kami mulai menambahkan breakpoint melalui @mixins super mudah kami yang telah kami siapkan dan telah digunakan kembali.

Di breakpoint mama-bear kita turun ke 3 kolom, lalu kita buat breakpoint interim di antara mama-bear dan baby-bear yang pecah menjadi 2 kolom, lalu akhirnya 1 kolom di baby-bear. Ini sangat mudah, karena yang perlu kita lakukan hanyalah menyesuaikan berapa banyak kolom yang kita atur melalui CSS3 column-count.

Kami mengakhiri video dengan membicarakan tentang tujuan masa depan galeri. Alangkah baiknya dapat memuat jumlah gambar yang berbeda pada ukuran layar yang berbeda dan menggunakan gambar mini yang sebenarnya, bukan gambar ukuran penuh. Mungkin suatu hari kita akan sampai di sana.

Sebagai catatan, software yang saya gunakan secara lokal untuk menangkap screenshot dan menguploadnya ke server melalui FTP adalah LittleSnapper.

Artikel yang menarik...