3. margin vs. padding / border vs. outline

   ◾ margin vs. padding

 

 

 

   

✅ padding은 요소의 내부에 빈 공간을 추가하고 margin은 요소의 주위에 빈 공간을 만든다.

 

 

 ◾ border vs. outline

 

 - border : 실제로 그만큼의 공간을 차지하게 되어 레이아웃에 영향을 끼친다. 

 

 - outline : 레이아웃에 영향을 끼치지 않는다. 

 

✅ border은 상하좌우 각각에 설정값을 줄 수 있지만, outline은 그렇게 할 수 없다.