LG 모바일 기기와 삼성 모바일 기기의 기본 브라우저 화면 뷰포트가 다르더군요.

뷰포트 메타값을 넣지 않아도 삼성 제품은 1.0 사이즈로 출력이 되는데

LG G2의 경우는 제각각 나타나는 것 같습니다.

 

일단 메타값으로 뷰포트를 넣어주니 정상적으로 두 모바일 기기에서 똑같이 보여지더군요.

 

<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" />

 

모바일 레이아웃 만들 때는 꼭 뷰포트는 넣어서 제작하세요..

이온디

profile
이온디는 라이믹스를 비롯한 다양한 CMS의 시드뱅크를 꿈꿉니다. 여러분들이 사랑하는 웹소스를 언제든지 사용할 수 있게 하기 위해 이온디는 매일 소스코드를 유지보수하고 있으며, 언제든지 다운로드할 수 있는 소스마켓을 운영하고 있습니다.

#XE마켓 - 이온디스토어
https://eond.com/xemarket/

# XE/라이믹스 단톡방을 운영 중입니다. (비번: 2022)
https://open.kakao.com/o/giaKKnl

# XE/라이믹스 생활코딩 모듈 강좌입니다.
https://opentutorials.org/module/3774
  • profile
    모바일 설정하면 뷰포트가 자동 추가 되지 않나요?

    또 메타 값을 넣으려면

    {@
    Context::addMetaTag('viewport', 'target-densitydpi=device-dpi, width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0');
    }

    이런식으로 넣어야 하죠~
  • profile
    옛날에 viewport 모르는 디자이너들이 600픽셀 고정해서 디자인하고 480픽셀 고정해서 디자인하고 사용자들만 고생했죠..
  • profile
    저두 이것 때문에 고민했는데 꿀팁입니다. ㅎㅎㅎ