[코드잇 스프린트] 0308 데일리 퀴즈

 

 

 

1. width:auto; 과 width:100%; 의 차이점에 대해 설명하기

 

width: auto는 내용물(자식 요소)의 크기에 맞춰 자동으로 크기가 조절된다.

하지만 display: block인 경우에 width: auto를 설정할 경우 내용물 크기가 아닌 부모 요소의 크기만큼 조절된다.

결론적으로 태그의 요소 성질(block, inline-block, inline)에 맞춰 자동설정 된다.

 

width: 100%는 부모 요소 크기만큼 크기가 조절된다.

따라서 margin을 추가하면 부모의 영역을 벗어나는 것을 볼 수 있다.