perbedaan antara align-item dan align-content

plss jawab sama contohnya juga terus penjelasannya

saya masih bingung kalau align-item sama align-content kan seperti sama aja

terus perbedaan nya apa

avatar GHAZTHISKC119
@GHAZTHISKC119

9 Kontribusi 3 Poin

Diperbarui 3 tahun yang lalu

2 Jawaban:

<div>Langsung aja saya kasih linknya gan.<br>https://www.w3schools.com/cssref/css3_pr_align-content.asp<br>https://www.w3schools.com/cssref/css3_pr_align-items.asp<br>Pada dasarnya memang mirip dan mungkin hasilnya bakal sama untuk banyak kasus. Agak susah jelasinnya, mending langsung lihat contoh penggunaannya di link di atas.</div>

avatar ChronoJava
@ChronoJava

41 Kontribusi 23 Poin

Dipost 3 tahun yang lalu

Tanggapan

terima kasih bro @ChronoJava

<div>Ada 6 property yang hampir mirip. justify-items, justify-content, justify-self, align-items, align-content, align-self.<br><br>Aku sendiri memahami property tersebut sebagai berikut.<br><br>1. Semua justify mengatur element secara horizontal (atas-bawah).<br><br>2. Semua align mengatur element secara vertikal (kanan-kiri).<br><br>3. Semua -content mengatur hubungan child element dengan child element lainya yang berada dalam jangkauan flex. Contoh dalam satu div dengan flex ada 3 div, maka kita mengatur hubungan antar 3 div itu dengan properti ini.<br><br>4. Semua -items mengatur hubungan seluruh child element dengan parent elementnya. Contoh, dalam satu div dengan flex ada 3 div, maka dengan properti ini kita mengatur hubungan antar 3 div tersebut dengan div yang punya flex.<br><br>5. Semua items mengatur hubungan salah satu child element dengan parent elementnya. Contoh dalam satu div dengan flex ada 3 div, maka dengan properti ini kita bisa mengatur hubungan antar salah satu dari 3 div itu dengan parent elementnya.<br><br>Dengan pemahaman ini,<br><br>justify-content berarti kita mengatur secara horizontal hubungan antar child element dalam flex. Contoh,<br>+<br>+<br>+<br>Dengan ini kita bisa mengatur apakah 3 + tersebut berjarak, berdempetan di tengah atau di bawah atau di atas.<br><br>justify-items berarti kita mengatur secara horizontal hubungan child element dengan child element dengan parent element.<br>+++<br>Dengan ini kita bisa mengatur apakah 3 + itu berada di tengah parent, di atas, bawah atau di mana.<br><br>align-content berarti kita mengatur secara vertikal apakah hubungan antar child element.<br>+ &nbsp; +&nbsp; &nbsp;+<br>Dengan ini kita bisa mengatur apakah 3 + tersebut berjarak, berdempetan di tengah, bawah atau atas.<br><br>align-items berarti kita mengatur secara vertikal hubungan antar child element dengan parent element.<br>&nbsp; &nbsp;+<br>&nbsp; &nbsp;+<br>&nbsp; &nbsp;+<br>Dengan ini kita bisa mengatur apakah 3 + tersebut berada di tengah parent, kanan, atau kiri.</div>

avatar fahmiburhan
@fahmiburhan

1 Kontribusi 1 Poin

Dipost 3 tahun yang lalu

Tanggapan

itu gak terbalik bro @fahmiburhan yang justify sama yang align soalnya waktu saya coba justify itu kiri kanan dan align itu atas bawah

Login untuk ikut Jawaban