[Bootstrap4 사용법] display 사용하기

1. div 를  inline 처럼 사용하기 (d-inline 클래스)

 

 

---

 

2. div 를 inline-block 으로 사용하기 (d-inline-block 클래스)

 

 

 

※ inline 과 inline-block 과의 차이점

• 윈도우 사이즈를 최대화 했을 때 (1792x919)

 

• 윈도우 사이즈를 줄였을 때 (929x919)

일정 breakpoint 를 지나면 d-inline-block 이 적용된 div의 경우 아래 row로 분리됨

 

 

• 윈도우 사이즈를 더 줄이면?

d-inline 은 마치 문단마냥 자연스럽게 아래로 이어지지만, 

d-inline-block 은 하나의 div끼리 딱딱 분리됨