모바일 장치 용 CSS 위치 지정

내 페이지가 데스크탑 브라우저에서는 제대로 표시되지만 모바일 장치에서는 표시되지 않습니다. URL은 [문제 해결 후 제거됨]입니다. 왼쪽 상단의 로고가 절대적으로 배치됩니다. 머리글 아래 div는 절대적으로 left: 0으로 배치됩니다. 현재 div#page에는 position:relative이 있지만 많은 랩퍼 div에 상대 위치 지정을 시도해 보았습니다. 나 또한 각각의 PHP 파일 (예 : header.php, body.php)에 PHP 출력 버퍼가 있습니다.모바일 장치 용 CSS 위치 지정

슬라이드 쇼는 jQuery Cycle 플러그인을 호출하는 WordPress 플러그인을 사용하며 절대 및 상대 위치 지정도 선언하므로 상대적인 내용과 절대적인 내용이 혼동 될 수 있습니다. 그러나 필자는 겉으로보기에는 모든 조합에서 상대적 위치 지정과 절대 위치 지정을 시도했지만 여전히 운이 없었습니다.

p.s. 나는 CSS가 혼란 스럽다는 것을 안다. 나는이 포지셔닝 문제를 파악한 후에 리팩토링을 진행할 계획이다.

출처

2012-02-29 dyelawn

플로트를 방치하면 어떨까요? – David

왼쪽 플로트로 문제가 해결되지 않습니다. 나는 원래 960 그리드 시스템의 전체 레이아웃을 기반으로 렌더링 된 것으로 간주되는 것들을 떠있었습니다. 그러나 로고와 적절한 내용으로 중첩 효과를 얻고 싶었습니다. – dyelawn

모바일 크기에 영향을 미칠 특정 중단 점에서 다음 CSS를 추가하는 미디어 쿼리가있는 것 같습니다. 당신이 정확히 모바일 버전 잘못 느끼는 것을 명확히 할 수 있다면

#main #content { margin: 0 7.6%; width: auto; }

는 우리가 더 나은 대답을 줄 도움이 될 것이다. 슬라이더 이미지 아래에서 설명 텍스트가 충돌하는 것을 찾으십니까?

출처

2012-02-29 16:15:11 ckaufman

모바일 버전에서는 헤더 아래의 모든 콘텐츠가 오른쪽으로 밀려 나오고 콘텐츠의 오른쪽은 잘립니다. 나는 로고의 절대 위치에 의해 지시 된 픽셀의 양에 의해 밀려나고 있다고 생각한다. – dyelawn

logo

stuff

'과 같이 머리글의 높이, 눈에 띄는 오버 플로우 및 가장 높은 z- 인덱스가 있으므로 로고가 내용과 겹치는 것처럼 보입니다. – dyelawn

모바일 장치 용 CSS 위치 지정

답변

관련 문제