나는 웹 사이트에서 작업하고 있습니다. http://www.bbp.nl/luuk-test/wac FF와 IE에서 정말 잘 나타납니다. Chrome에서 테스트했는데 완전히 엉망입니다. 어떻게 든 Chrome은 모든 div를 서로 아래에 표시합니다. W3C 유효성 검사기에서 유효성 검사가 잘 된 이후로 어디서 볼지 모르겠습니다.크롬이 웹 사이트 레이아웃을 엉망으로 만듭니다. FF 및 IE가 좋습니다.
googled,하지만 아무것도 찾을 수 없습니다. 누구든지 대답을 알고 있습니까? 도와주세요.
먼저 HTML을 읽기가 더 쉽다면 유용 할 것입니다.
41 번째 줄에 단락 태그를 열었습니까? 그게 문제입니까?
41 번 줄에서 열어 본 단락의 종료 태그도 찾을 수 없습니다. HTML이 유효한지 확인하고 http://browsershots.org/과 같은 사이트에서 테스트하는 것이 매우 중요합니다. –
div에 대한 mozilla 브라우저의 계산 된 상자 크기를 변경하려면 스타일 시트의 20 행에서 -moz-box-sizing을 사용하고 있습니다. 크롬에서는 인식되지 않습니다.
참조 : 당신은 웹킷을 사용하여 브라우저에 대한 수정을 적용 할 수 있습니다 https://developer.mozilla.org/en/CSS/-moz-box-sizing
, 너무 : 제 생각에는
div {
box-sizing: border-box;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
}
더 나은 방법은 당신의 웹 사이트가이 해결없이 잘보고 계산하게하는 것입니다 귀하의 원하는 크기와 패딩을 기준으로 상자 크기.
그래서 firefox에서 발견 된 것처럼이 문제의 크롬에 대한 수정 사항이 있습니까? – Luuk
이 수정 프로그램을 계속 사용하려면 다음을 사용하십시오. -moz-box-sizing : border-box; 박스 크기 : border-box; -webkit-box-sizing : 테두리 상자; – stefanglase
취득이 부가 기능은 파이어 폭스 것은 당신이 페이지에있는 모든 오류 ... Machiel가 언급 한 바와 같이 개방형 < -P-> 태그를 포함 말할 것입니다 ...
당신의 CSS에서그것은 P가 아니므로 제거했습니다. 내부에서가 아니라 div 외부에 패딩을 추가하는 것으로 보입니다. – Luuk
, 당신은 :
box-sizing: border-box;
-moz-box-sizing: border-box;
는 웹킷 (크롬/사파리)에서이 작업을 얻을 사용하려면 -webkit-box-sizing
-webkit-box-sizing: border-box;
상자 크기 조정 속성을 완전히 제거하고 크기 조정에 여백, 여백, 너비 및 높이와 같은 더 적합한 기능을 사용합니다.
크롬은 상자 크기를 지원하지 않습니다. 이는 CSS3의 일부이기 때문에 성가신 일입니다.
DIV에 100 %의 여백을 지정한 다음 경계선과 여백을 5px (예 : 5px)로 지정하면 문제가 발생합니다. 상자 크기를 테두리 상자로 설정하면 멋진 들여 쓰기 된 DIV를 얻을 수 있습니다. 상자 크기가 지정되지 않으면 div가 오버플로됩니다. 이제는 래퍼 DIV를 사용하여 주변을 둘러 볼 수 있지만 마크 업을 추가하거나 픽셀 단위로 너비를 지정하면됩니다. 그러나 너비를 모르는 경우에는 작동하지 않습니다.
유효성을 검사합니까? FF는 코드를 표시하기 전에 코드를 정리하는 경향이 있습니다. –
지금 막 사이트에 뭔가를했거나 레이아웃에 근본적으로 잘못된 것이 있습니다. 나는 Fx 3.6에서 그것을 확인했고 완전히 엉망이되었다. 사이트가 IE에서만 작동하는 경우 레이아웃은 IE 버그에 따라 의도 된대로 표시됩니다. – Guffa