CSS 썸네일형 리스트형 [CSS] 아이폰 X 모델 이상 M자 부분 퍼블리싱 최근에 발매되고 있는 스마트 폰들의 상단영역(노치) 부분을 퍼블리싱 하기 위해서는 일단. 템플릿에 ViewPort의 설정을 추가해 주어야 한다. Before (보통 이렇게 생겼을듯...) After 이런식으로 해당 부분을 추가하고 나면 기존에 디자인 한 부분이 위로 올라가면서 노치 부분과 겹처보이는 것을 볼수 있다. 그렇다면 해당 부분에 padding-top 영역을 주어 적당하게 내려오게 하면 된다. padding-top을 줄때는 하드코딩이 하는 디바이스내의 값을 환경변수를 이용하는 것이 좋다. IOS 같은 경우는 버전에 따라 아래와 같이 사용한다. // iOS 11.0 버전 body{ constant(safe-area-inset-top) constant(safe-area-inset-right) cons.. 더보기 이전 1 다음