본문 바로가기

밥벌이 :)/해결된 이슈들

Android 4.0 position fixed bug

반응형

Android 4.0 position fixed bug


모바일 웹사이트 개발 중 하단에 고정메뉴를 position fixed로 고정하였는데,

다른 폰에서는 전혀 이슈가 없었는데, 갑자기 갤럭시 노트1에서 문제가 있다고 한다.

해당 기기(구하기도 힘든 노트1 ㅜㅜ)로 확인을 해보니

좌측으로부터 10px정도 떨어져 있었다.



뭐지..... 좌우측 위치에 대한 스타일은 준적도 없는데..

하단 고정메뉴 style은 아래와 같다.


.fixed_menu {width:100%; position:fixed; bottom:0; background-color:#0062a3; border-top:1px solid #fff; box-shadow: 0px 1px 7px gray; z-index:9999;}


딱히 정해진 위치값은 없었고,

그냥 100% 사이즈에 바닥에만 붙어있으면 됐기 때문에 여느때처럼

position:fixed; bottom:0; 만 줬었는데,

왜 좌측에 공백이 생긴걸까.. 


일단 left:-10px;로 좌측 공백을 매꿔보니 이번엔 우측에 공백이 생기더라. -_-

순간 느낌이 오더라.


left:0; 을 추가해주니 정상적으로 나왔다.

참.. 별 이슈가 다 있구나.


아래는 최종 소스

.fixed_menu {width:100%; position:fixed; bottom:0; left:0; background-color:#0062a3; border-top:1px solid #fff; box-shadow: 0px 1px 7px gray; z-index:9999;}

반응형