Flex 핵심정리 #5 - Flex 속성 활용에서 질문 있습니다.
강의 (02:11) 에서 "전체 영역 자체를 1:3:1 로 갖는다."라고 하셨는데요, 제가 바로 전강 #4에서는
flex-grow는 flex item 내부의 내용물이 제외된 부분(여백)에 대해서만 비율을 따지는 걸로 알고 있는데,
왜 여기 #5에서는 "내용물까지 포함된 전체"에 대해서 비율로 따지게 되는건가요??
제가 뭘 놓친건가요? ㅠㅠ
답변 2
1
축약형을 사용할 때
flex: 1;
이런 식으로 flex-basis를 생략하면 flex-basis에는 0%가 들어가게 되어있어요.
강의 초반부에 해당 설명이 나옵니다^^(0:35 지점쯤부터)
flex-basis가 0이기 때문에 기본 점유 영역이 0이 되고, 따라서 공간 자체를 1:3:1로 나누게 되는 거에요.
flex: 1 1 auto;
축약형을 쓰실 때 위와같이 flex-basis도 명시적으로 적어주시면 적어준 값으로 동작합니다.
저는 예시로 기본값 auto를 넣어 본 것이고요.
가로스크롤 과 margin: 0 -1rem 질문 있습니다
0
120
1
수업자료 다운로드
0
122
1
VS코드에 클래스 이름만 넣으셨는데 선생님이 뭘 누르면 바로 태그로 변하던데...
1
138
1
css grid repeat() 에서 autofit 사용시
0
184
1
menu 아이템 반응형 변경
0
102
1
질문은 아니고.. 오타 발견..
0
121
1
웹에서 위치?값
0
212
1
px, em ,rem을 어떻게 감각적으로 쓸 수 있을까요?
0
510
2
강의에 나오는 html 자동으로 만들어주는 편집기에 대해 알 수 있을까요?
0
310
1
flex-basis auto, 0 차이
0
711
2
padding 대신 gap을 쓰는게 더 편하지 않나요?
2
607
1
animation forwards 관련 질문
0
489
2
auto-fill, auto-fill이 적용되지 않는것 에 대해 질문드립니다.
0
560
1
flex-grow IE 질문드립니다.
0
625
2
Flex-grow가 적용되는 영역에 대해 질문드립니다.
0
437
1
Grid 수직정렬 문의
0
1076
1
card__item에 display:flex를 했을 때..
0
513
1
11vmin
0
419
1
header class 안에 div와 h2
0
577
1
grid 반응형 페이지 step1 질문있습니다~
0
282
1
반응형 페이지 step4 order
0
357
1
미디어쿼리 사이즈
1
287
1
figure + div
0
301
1
CSS Grid를 통한 정렬의 장점
0
248
1