min-height관련 질문드립니다!
1367
작성한 질문수 5
항상 코딩함에 있어서 부모에게 높이를 안주면 자식이 높이를 못가지는 문제가 생기는데
보통 html,body에 100%를 주면서 해결하더라구요
근데 상황따라 이게 잘 안될때가 있던데 min-height: 100vh와 body height:100%를 같이 먹이면 자식들 컨텐트의 크기에 상관없이 전체를 덮을 수 있을까요?
https://qastack.kr/programming/6654958/make-body-have-100-of-the-browser-height
여기서도 해결 방법이 다양하게 나열되어있는거 같던데 보통 잘 안되는게 많더라구요 ㅠ
답변 1
1
100vh는 부모 엘리먼트가 뭐든 상관없이 무조건 뷰포트 높이(일반적으로 브라우저 높이)로 인식하기 때문에
vh를 지원하는 브라우저라면 확실하게 보장됩니다. 다만 기기 종류나 브라우저에 따라 생겼다 사라지는 브라우저 메뉴영역으로 인해 스크롤바가 살짝 생길 가능성도 있어서 그 부분을 따로 처리해야하는 경우가 있을 수 있습니다(이런 것들은 브라우저 업데이트에 의해 자동으로 해결되는 경우도 있어서, 타겟 브라우저별로 살펴보는 수 밖에 없습니다).
min-height, height를 이용한 방법도 사이드이펙트를 발생시킬만한 다른 요인이 없다면 안되는 경우를 못본 것 같습니다.
만약 안된다면 다른 곳에서 html이나 body의 높이를 따로 설정하고 있지 않은지 체크해 보세요^^
가로스크롤 과 margin: 0 -1rem 질문 있습니다
0
119
1
수업자료 다운로드
0
122
1
VS코드에 클래스 이름만 넣으셨는데 선생님이 뭘 누르면 바로 태그로 변하던데...
1
138
1
css grid repeat() 에서 autofit 사용시
0
183
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
418
1
header class 안에 div와 h2
0
576
1
grid 반응형 페이지 step1 질문있습니다~
0
282
1
반응형 페이지 step4 order
0
356
1
미디어쿼리 사이즈
1
286
1
figure + div
0
300
1
CSS Grid를 통한 정렬의 장점
0
247
1