이번 주담대 UI 변경 작업에서 다음으로 이동
버튼에 대한 정의는 다음과 같아요.
<aside> ☝🏻 다음 버튼은 기본적으로 화면 하단에 위치하고, 키패드가 등장하면 버튼은 줄어든 화면만큼 키패드와 함께 올라가야 해요.
</aside>
뭐야~ 레이아웃 컴포넌트의 height를 100vh로 설정하면 끝나는거 아님?
아님
iOS 환경에서는 높이를 100vh로 설정하더라도 동적 툴바(주소, 네비게이션바)로 인해 스크롤이 발생하게 됩니다.
해당 현상은 다음 속성을 통해 해결할 수 있습니다.
.fill-screen {
width:100vw;
height: 100vh; /* 새 단위를 지원하지 않는 소수의 브라우저를 위해 */
height:100dvh;
}
svh
/lvh
사이에서 탭의 유무에 따라 동적으로 변화