• 카테고리

    질문 & 답변
  • 세부 분야

    웹 개발

  • 해결 여부

    미해결

vw, vh의 크기에 대하여

21.07.06 22:22 작성 조회수 165

0

안녕하세요!!
이전부터 css를 다루면서 사소한 궁금증이 생겼는데요,
100vw와 100vh라고 크기를 적어주면 브라우저 폭과 높이가 되어야 하는 것으로 알고 있습니다.
그런데 실제로 적용해보면 스크롤바가 생기고 실제 브라우저보다 조금씩 크게 되더라고요.
혹시 왜 이런 현상이 발생하는지 알려주실 수 있나요?

강의 정말 재밌게 잘 듣고 있습니다!! 좋은 강의 만들어 주셔서 감사합니다! :)

답변 1

답변을 작성해보세요.

1

브라우저나 운영체제에 따라, v 단위가 스크롤바 또는 주소창, 하단 메뉴 등을 포함하는 경우가 있더라고요.
그래서 브라우저에 따라 조금씩 다르게 처리해주거나, 100vh 대신 100%를 사용하시면 됩니다.
100%를 사용할 경우는, 부모 요소의 크기가 브라우저 크기만큼 차지하고 있는지를 확인해주셔야 하고요~
자식 요소가 position: absolute; 일 때는 부모 요소의 크기를 고려 안해도 되지만, 혹시 부모에 position: relative 등 static 외의 값이 설정된 경우에는 자식 요소가 absolute인 경우에도 부모의 크기를 확인해주셔야 한답니다.