TIL | display

💡display란?
-요소를 어떤 형태로 나타나게 할 것인지를 말하는 속성이다.

display의 3가지 속성

#html
<div id="a">딸기</div>
<div id="b">바나나</div>
<div id="c">멜론</div>

👉 inline : 줄바꿈 되지 않고 바로 오른쪽에 표시된다.

div {
 width:100px;
 height:100px;
 display:inline;
}

👉 inline-block : 줄 바꿈이 되지 않지만 크기를 지정 할 수 있다.

div {
 width:100px;
 height:100px;
 display:inline-block;
}

👉 block : 항상 다음 줄에 배치된다.

div {
 width:100px;
 height:100px;
 display:block;
}