반응형 작업시 viewport 설정 관련 문의
본문
head.sub.php에 아래와 같이 소스가 들어가 있습니다. 그런데 모바일로 볼 때는 화면이 100%로 맞춰져 있는 게 아니라 확대되어 보입니다.
접속시 모바일 기기에 맞게 양옆이 100%로 맞게 해주고 싶은데 어떤 소스를 수정 혹은 새로 삽입해야 할까요?
<meta name="viewport" content="width=device-width, initial-scale=1">
<?php
if (G5_IS_MOBILE) {
echo '<meta name="viewport" content="width=device-width,initial-scale=1.0,minimum-scale=0,maximum-scale=10,user-scalable=yes">'.PHP_EOL;
echo '<meta name="HandheldFriendly" content="true">'.PHP_EOL;
echo '<meta name="format-detection" content="telephone=no">'.PHP_EOL;
} else {
echo '<meta http-equiv="imagetoolbar" content="no">'.PHP_EOL;
echo '<meta http-equiv="X-UA-Compatible" content="IE=10,chrome=1">'.PHP_EOL;
}
if($config['cf_add_meta'])
echo $config['cf_add_meta'].PHP_EOL;
?>
답변 3
올려주신 코드자체는 문제가 없어 보입니다.
원인이 다른곳에 있는지 찾아보세요.
echo '<meta name="viewport" content="width=device-width,initial-scale=1.0,minimum-scale=0,maximum-scale=10,user-scalable=yes">'.PHP_EOL;
이 부분만 주석처리 해보거나
<meta name="viewport" content="width=device-width">
로 변경해보세요.
viewport는 문제가 없어보입니다.
정확한것은 해당 화면을 직접 봐야할것 같으나
추측하기로는 작업하신 반응형 요소중에 아직 고정된 너비를 가지고 있다거나, 모바일 화면보다 너비가 큰 엘리먼트가 있을것 같습니다.
이부분을 확인해보시고 괜찮으시다면 사이트 주소를 알려주세요.