강의

멘토링

커뮤니티

인프런 커뮤니티 질문&답변

leekj951008님의 프로필 이미지
leekj951008

작성한 질문수

CSS Flex와 Grid 제대로 익히기

Flex UI #7 - 카드 리스트

card__item에 display:flex를 했을 때..

작성

·

488

0

강사님 질문이 있습니다...

card-item에 displat:flex를 적용하면 기존 화면에서

스크린샷 2022-12-22 오후 9.20.57.png

아래와 같이 화면이 나오는데요 이때 왜 card-image에 flex-shrink:0값을 줘도 이미지가 안보이는건지 잘 이해가 안됩니다

이미지는 왜 사라지는건가요?

스크린샷 2022-12-22 오후 9.19.55.png

스크린샷 2022-12-22 오후 9.16.29.png

답변 1

0

1분코딩님의 프로필 이미지
1분코딩
지식공유자

.card__image에는 background 이미지를 깔았을 뿐, 원래 내용물이 아무것도 없기 때문에 차지하는 공간이 없습니다. flex-shrink라는건 최소한 안에 들어있는 내용물의 width(또는 height) 만큼은 쪼그라지지 않게 지켜주는 건데, card__image는 애초에 차지하는 공간이 없기 때문에 flex-shrink도 의미가 없어지는 거라고 생각하시면 되겠습니다.

leekj951008님의 프로필 이미지
leekj951008

작성한 질문수

질문하기