-
질문 & 답변
카테고리
-
세부 분야
웹 개발
-
해결 여부
미해결
min-width
20.03.24 23:13 작성 조회수 274
1
안녕하세요!
강의 잘 듣고 있습니다.
강의 내용 중에 궁금한 점이 하나 있어서 질문 드립니다.
검색창 만드는 부분에서 강의 내용에는 없고, 다운 받은 강의자료에는
.search-form input[type='search'] {
flex: 1;
min-width: 0;
margin-right: 10px;
border: 0;
border-radius: 0.3em;
font-size: 1rem;
}
이렇게 min-width: 0이 있던데,
이 부분이 추가된 이유를 잘 모르겠습니다.
답변을 작성해보세요.
7
1분코딩
지식공유자2020.03.27
Flex 아이템에 shrink가 적용되더라도, 안에 있는 콘텐츠의 양에 따라 제대로 줄여지지 않는 경우가 있을 수 있는데요,
그럴 경우에 대비한 안전 장치로서 min-width: 0을 사용합니다.
지금 여기에서는 창의 크기를 극단적으로 작게 줄여보시면 티가 날거에요~
min-width: 0을 넣기 전에는 텍스트 인풋의 크기가 일정 크기 이하로 줄어들지 않는데,
min-width: 0을 넣어주면 아주 작은 크기로도 유연하게 줄어드는 것을 확인하실 수 있을 거에요.
해당 내용도 추후에 업데이트 해야겠다는 생각이 드네요^^
알려주셔서 감사합니다!
답변 1