css - iphone에서 방향 변경이있는 절대 위치 지정

건물이있는 모바일 웹 사이트가 있으며 화면 하단에 로고가 배치되기를 원합니다. 처음로드 될 때 가로 및 세로 모드로 올바르게 표시되지만 두 방향의 방향이 바뀌면 위치가 자체 위치로 업데이트되지 않습니다. 어떻게해야합니까? 여기 내 CSS의 :css - iphone에서 방향 변경이있는 절대 위치 지정

#logo { position:absolute; bottom: 10px; right: 10px; }

내가 필요한 경우 위치하는 자바 스크립트/JQuery와에 액세스 할 수 있습니다,하지만 난 순수 CSS 기반의 솔루션을 찾는 것을 선호합니다. 이미 미디어 쿼리를 사용하고 있습니다. 그러나 전체 창 높이가 iphone에서 제대로 조정되지 않는 것 같습니다. 안드로이드에서 잘 작동합니다.

출처

2011-08-23 mheavers

[미디어 쿼리] (http://www.w3.org/TR/css3-mediaqueries/)가 도움이 될 수 있습니다. – thirtydot

<body onorientationchange="updateOrientation();"> 

/* Portrait */ 

@media screen and (max-width: 320px) 
{ 
    #logo {right: 10px; } 

} 

/* Landscape */ 

@media screen and (min-width: 321px) 
{ 
    #logo {right: ___} 
}

출처

2011-08-23 21:10:55

감사합니다. 실제로 미디어 쿼리를 사용하고 있지만 iPhone에서는 제대로 배치하지 않았습니다. 방향에 관계없이 하단과 오른쪽에서 10px를 원하지만 iPhone은 방향 변경시 바닥이 어딘지를 추적합니다. – mheavers

mheavers : –

css - iphone에서 방향 변경이있는 절대 위치 지정

답변

관련 문제