2012-02-20 6 views
0

Disqus CSS로 인해 발생하는 것으로 보이는 문제가 있습니다.Safari iPhone의 랜덤 CSS 스타일링

Disqus CSS는 내 페이지의 주 콘텐츠 텍스트가 크기가 무작위로 변경되도록합니다. 새로 고침을 클릭하면 일부 텍스트가 무작위로 커지고 일부는 작아지고 굵게 표시됩니다. iPhone (실제 및 시뮬레이터)의 Safari에서만 발생하는 것으로 보이며 Firefox, IE, Android 및 iPad Safari에서 정상적으로 작동합니다. Disqus 주석을 끄면 문제가 해결됩니다. Disqus 테마를 변경하고 모바일보기를 켜고 끄려 고 시도했습니다. 아래에서

같은 페이지가 내가 새로 고침 (live site-it should look like this)

Random styling Same page after refresh

어떤 도움을 크게 감상 할 수을 클릭 다르게마다 렌더링되는 것을 볼 수 있습니다.

답변

2

-webkit-text-size-adjust : none;을 적용해볼 수 있습니다. Disqus 코드를 목표로 삼고 있습니까? Disqus가 iframe을 사용하지 않는다는 것을 기억하면 사용하는 계층 구조가 ifs를 사용하는 것보다 강하다면 작동해야합니다. 여기

상세 정보 : http://css-infos.net/property/-webkit-text-size-adjust

희망하는 데 도움이 :

편집 : 아래 그 코멘트를 쓰는 동안 난 그냥 생각을했다. 뷰포트 너비를 명시 적으로 또는 장치 너비로 설정하여 정렬 할 수 있습니다.

예를 들어 아이폰의 뷰포트는 세로 320px, 가로 460px입니다 (맞습니까?).

<meta name="viewport" content="width=device-width, initial-scale=1"> 

스크린 샷을 보면 실제로는 너무 작아서 이렇게 좋을 수도 있습니다.

<meta name="viewport" content="width=800, initial-scale=1"> 

실제로 이것은 텍스트 크기가 처음 변경되는 이유입니다. 아이폰은 세로와 가로 모두에 맞게 800px까지 확장 할 수 있습니다. 세로로 보면 글꼴이 너무 작아서 글꼴이 커질 수 있습니다.

더 많은 정보를 원하시면 여기를 참조하십시오 : https://developer.apple.com/library/ios/#DOCUMENTATION/AppleApplications/Reference/SafariWebContent/UsingtheViewport/UsingtheViewport.html

+0

와우 같은 빠른 정답은 진정으로 놀랍습니다. 내 콘텐츠 컨테이너 (..a td)에 추가하면 트릭을 완료 한 것으로 보입니다. #review_content * { -webkit-text-size-adjust : none! important; } 아이디어가 무작위로 변경되는 이유는 무엇입니까? 답변을 수락하기 전에 다른 날을 기다릴 것입니다. 단지 "중요하지 않은"대답이 아닌 경우에만 팝업됩니다. 고마워. – row1

+0

사람들도 다음과 같이 사용하는 것을 권장하지 않습니다. http://www.456bereastreet.com/archive/201011/beware_of_-webkit-text-size-adjustnone/ – row1

+0

네, 저는 여기 저기에 사용하지 않을 것입니다. 그것은 iPhone만의 문제입니다. 아마 그 인스턴스에서만 사용할 수 있습니다. 그 이유에 대한 나의 추측은 Disqus가 처음으로 HTML을 삽입 할 때 실제로 뷰포트가 폰트 크기가 얼마나 큰지에 대한 결정을 내리는 동시에 보일 때보다 넓어야한다는 것입니다. 읽을 수 있어야합니다. 실제로 실제로 저를 생각하게 만들었습니다. 텍스트 크기를 조정하지 않고도 다른 방법으로 정렬 할 수 있습니다. 위의 내용을 수정합니다. – will