css safe area 적용 안될때!

2023. 12. 11. 11:17·CSS

아이폰 safe area 대응을 해야할 경우가 있었는데 

요렇게 선언을 해도 안먹는 경우가 있었다. 

top: env(safe-area-inset-bottom)

 

viewport 에 viewport-fit 을 적용하지 않아서 난 이슈였다. 

viewport-fit=cover 을 적용하니 해결됨 

<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1, user-scalable=no, viewport-fit=cover" />

'CSS' 카테고리의 다른 글

css로 부모선택자 선택하기  (0) 2024.07.04
transition animation height  (0) 2024.03.18
.scss 파일에서 dom data 정보 가져오기  (0) 2024.01.23
한글, 영문 폰트 다르게 적용하기  (0) 2023.04.17
:not 선택자는 익스 지원하지 않는다.  (0) 2021.09.29
'CSS' 카테고리의 다른 글
  • transition animation height
  • .scss 파일에서 dom data 정보 가져오기
  • 한글, 영문 폰트 다르게 적용하기
  • :not 선택자는 익스 지원하지 않는다.
ssund
ssund
  • ssund
    ssund의 기술블로그
    ssund
  • 전체
    오늘
    어제
    • TECH (82)
      • Next.js (8)
      • React (25)
      • Vite (1)
      • javascript (17)
      • CSS (6)
      • CS (10)
      • AWS (0)
      • Jest (1)
      • CI|CD (0)
      • 알고리즘 (8)
      • Tools (1)
      • Tips (5)
  • 블로그 메뉴

    • 링크

    • 공지사항

    • 인기 글

    • 태그

      git배포
      서버컴포넌트
      react state management
      웹브라우저구성
      배열요소순서
      Array.sort()
      nextjs
      JavaScript
      theme-provider
      커머스프로젝트
      styled-components
      React
      함수와 메서드차이
      redux
      타입스크립트
      reat-head
      app-router
      call signatures
      TypeScript
      global-style
    • 최근 댓글

    • 최근 글

    • hELLO· Designed By정상우.v4.10.0
    ssund
    css safe area 적용 안될때!
    상단으로

    티스토리툴바