Recent Posts
Tags
- svh
- useTransition
- fsd
- type-challenges-easy
- startTransition
- React
- websocket
- Viewport
- react-hook
- webrtc #ice #stun #turn
- msw2.0
- SDP
- dvh
- Mapped type
- Vite
- LVH
- MSW
- queryoptions
- tanstack-router
- webrtc
- mock-service-worker
- HTTP
- fsd-architecture
- queryfactory
- Typescript
- vh
- readonly
- type-challenges
- tanstack-query
- mutationoptions
Archives
- Today
- Total
목록CSS (1)
개발자 메론빵
💬 반응형 웹을 개발하면서 height를 100vh로 설정하는 경우 일부 화면이 모바일 브라우저 내 상단바 혹은 하단바에 의해 가려지는 문제가 있었다. vh(viewport)는 상하단바를 제외한 영역을 기준으로 한다. 따라서 다음과 같은 viewport 단위를 적절하게 사용해주어야 한다.📌vh (Viewport Height)vh는 스크린의 height를 기준으로 하여 백분위로 높이를 나타낸다. 예를들어 스크린 height가 800px인 경우 1vh는 8px이 되는 것이다. 모바일에서는 상하단바 유무와 상관없이 일정한 크기로 동작하는 정적 viewport 단위이다.📌dvh (Dynamic Viewport Height)dvh는 동적 viewport height를 기준으로 하여 백분위로 높이를 나타낸다...
CSS
2024. 10. 30. 11:35