Latihan 1: Position — CSS
Latihan 1 dari materi Position di CSS — praktek dengan editor kode interaktif, test case otomatis, dan hint terpandu. Langsung jalan di browser.
Geser kotak hijau dari tempat aslinya, turun dan ke kanan:
- Di aturan
div { ... } yang sudah ada, tambahkan position: relative; sebelum }.
- Tambahkan
top: 50px; supaya kotaknya turun 50px.
- Tambahkan
left: 75px; supaya kotaknya geser ke kanan 75px.
Ingat, left mendorong dari sisi kiri, jadi kotaknya bergerak ke kanan. Tiap baris pakai satu titik dua dan satuan px.
Hint
- Kotaknya perlu digeser dari tempat aslinya, turun dan ke kanan. Pakai top dan left, bukan margin.
- Pakai position: relative, lalu top buat turun dan left buat ke kanan. left mendorong dari sisi kiri, jadi kotaknya geser ke kanan.
- div { width: 80px; height: 80px; background-color: lightgreen; position: relative; top: 50px; left: 75px; }