모바일 첫화면이 왼쪽 상단을 클로즈업 하고있습니다.
본문
그누보드5로 모바일 게시판을 만들고 있습니다.
그누보드5 게시판을 모바일로 보면 첫 화면이 왼쪽 상단을 크게 클로즈업하고 있습니다.
pc 버전에서 보면 전체 화면이 잡혀서 잘 나옵니다.
상단과 하단 페이지는 제가 따로 만들어서 기존에 쓰던 상하단과 바꿔서 쓰고 있습니다.
상하단 파일을 주석처리하면 게시판만 나오는데 모바일 화면에 딱맞게 나옵니다.
상하단은 반응형으로 width를 100%로 지정해서 사용중입니다.
첫화면이 왼쪽상단이 커져서 나온다고 했는데 이 화면을 터치하면 제가 원했던 사이즈 크기로 만들어 집니다.(화면이 넓어집니다.)
이걸 처음부터 확대가 안되어있는 상태로 만들고 싶은데 혹시 알 수 있을까요.
width:100% 으로 되어 있는 상태이고
만일 상단 메뉴를 min-width:640px 으로 하면 메류바가 화면이 찌그러지고 , 1080으로하면 제가 원했던 넓이만큼으로 만들어집니다.
<meta viewport="width-device-whdt"~~~ 명령어도 입력해 보았는데 별효과는 보지 못했습니다....
혹시 원인을 아시는분은 알려주시면 감사하겠습니다...
답변 3
수정하셨다는 부분에서 자체 너비를 px 또는 em 등으로 가진곳이 없는 건가요?
일단, 상, 하단의 부모요소에 overflow: hiidden 값을 지정해보세요.
가령, hd {overflow:hidden} ft {overflow: hidden}
100%에 맞게 화면이 맞춰진다면 어딘가에 자체너비를 지정하신 곳이 있다는 것이겟죠.
하나씩 찾아들어가보시면 됩니다.
그누 기본 함수중에 모바일에서만 보일수 있는 함수가 있습니다.
이걸 활용해보세요!
<?php if (G5_IS_MOBILE) { ?>
모바일에서 보임
<?php } else { ?>
모바일에서 안보이고 PC에서 보임
<?php } ?>
<?php if (G5_IS_MOBILE) { ?>
모바일에서만 보임
<?php } ?>
첫 화면에서 그런거면 말씀하신 것처럼 메타쪽 밖에 없는데,
위에 스펠링 잘못 쓰셨는데 한번 확인해보실래요?
<meta name="viewport" content="width=device-width, user-scalable=no">