2012-07-18 2 views
0

최근에 내 첫 번째 클라이언트 중 하나에 대해이 사이트를 채찍질했습니다. 현재 나는 각각의 제목 아래에있는 텍스트가 모바일 장치에서 브라우징 할 때 약간 왼쪽이라는 이유를 찾을 수 있습니다. (사용 갤럭시 넥서스) 페이지 표시에 다른모바일에서 사이트를 볼 때 텍스트가 줄 바꿈

http://www.digitalgenesis.com.au/2012-websites/qsoils/example3.html

모든 완벽하고

나는 그것의 전체 너비에 표시 할 적갈색 제목 아래 텍스트를 원하는 성공하지 문제를 식별하기 위해 노력하고 살아야 이는 전체 포장 컨테이너의 60 %입니다. 텍스트는 일반 .info 태그에 여백이 주어 지므로 일반 화면 크기에서와 마찬가지로 적갈색 선에 중점을 두어야합니다. 0 자동; 부동산

어떤 도움도 디자인에 대한없는 치명적인 오류하지만 감사하겠습니다

, 건배

+0

여기에서 테스트 할 때 문제가 표시되지 않습니다. [테스트 사이트] (http://www.we-are-gurus.com/tools/responsive-design-tester.php?url=http%3A%2F%2Fwww.digitalgenesis.com.au%2F2012-websites%2Fqsoils % 2Fexample3.html & d = 320x480 & scroll = 꺼짐) – imakeitpretty

답변

1

이 동작은 의도적으로 설계된 동작입니다. 내 넥서스의 크롬은 주식 브라우저보다 훨씬 훌륭합니다.

가능한 솔루션은 다른 일반 휴대 전화 화면보다 더 넓은 렌더링 페이지를 강제 요소의 폭

@media screen and (max-width: 480px) { 
    #truck img { 
    width: 460px; 
    } 
    .info { 
    width: auto; 
    } 
    /* etc... */ 
} 

처럼 그 한계로, 다양한 화면 크기에 대해 서로 다른 CSS 규칙을 제공하는 것 너비 (세로 방향)

또 다른 옵션YAML과 같은 선형화 지원 기능이있는 CSS 프레임 워크를 사용하고 디자인을 다시 작성하는 것입니다. 이미지가 특별한 치료가 필요하기 때문에 아마도 둘 다의 조합 일 수도 있습니다.

휴대 기기의 소형 폼 팩터 때문에 큰 여백을 피하십시오.

0

단락에게주는 시도 {텍스트 정렬을 : 정당화;}과 모바일에서 문제를 간격 권리를 줄일 수 있는지 브라우저.