인터넷 익스플로러의 문제

나는 이모의 회사를 위해 나의 첫 번째 웹 사이트를 만들었고, 모든 브라우저에서 IE를 제외하고는 잘 보였다.인터넷 익스플로러의 문제

HTML 구조이다 : 모든 div를이 정렬

<body> 
<div id="wrapper"> 
<div id="page1"></div1> 
<div id="page2"></div2> 
</div> 
</body>

문제 대신 화면 중앙에 존재하는 왼쪽.

래퍼의 CSS 속성 text-align : center에 대한 몇 가지 조언을 찾았지만 나에게 적합하지 않습니다.

body { 
    background: #f8f8f8 url(../images/bg.png); 
    border-top: 3px solid #7e7e7e; 
    margin: 0; 

} 

#wrapper { 
    position: absolute; 
    left:0; 
    right:0; 
    top: 58px; 
    max-width: 960px; 
    margin: auto; 
    text-align: center; 

} 


#page1 { 
    float:left; 
    left:0; 
    right:0; 
    width: 960px; 
    height: 700px; 
    margin: auto; 
}

당신이 날은이 문제를 해결하는 데 도움이 수 :처럼

지금 보이는? 고마워.

또한 IE 문의 PHP 양식이 잘못 표시됩니다. 테두리가 텍스트 입력 양식을 넘었습니다.

감사합니다.

출처

2013-12-08 Almazini

IE-hell에 오신 것을 환영합니다. – span

낙관적 인 게시물 메이트에 감사드립니다! – Almazini

안녕하세요, [내 웹 사이트 또는 프로젝트의 일부가 작동하지 않습니다. 그냥 링크를 붙여 넣을 수 있습니까?] (http://meta.stackexchange.com/q/125997) 감사합니다! –

#wrapper의 CSS 규칙이 올바르지 않습니다. 뷰포트 중앙에 고정 폭 사이트를 사용하려면 절대 위치 지정을 사용하지 않아야합니다. 대신 너비를 설정하고 여백 자동을 사용해야합니다. 당신은 그곳에 중도에있었습니다.

CSS가 변경되어 어디서나 작동합니다.

#wrapper { 
    max-width: 960px; 
    margin: 60px auto; 
    text-align: center; 
}

이것은 실제로 사양을 실제로 구현하지 않는 다른 브라우저에 대한 것입니다. 절대 위치 지정 설정에서 왼쪽과 오른쪽을 0으로 설정하면 래퍼가 최대 길이 : 960 규칙이 아닌 전체 뷰포트 너비에 맞게 늘어났습니다. 절대 위치 지정이 우선합니다. 내부 뷰가 왼쪽으로 떠 있기 때문에 왼쪽 뷰가 모두 왼쪽으로 정렬됩니다. 그래서 IE는 실제로 올바르게하고 있습니다.

연락처 양식의 경우 실제 필드 내용만큼 넓지 않은 fieldset 너비가 200px로 설정됩니다. #contactus fieldset 규칙에서 너비를 제거하면 갈 수 있습니다. 다시 Chrome은 제대로 작동하지 않았습니다. 필드 집합의 너비를 설정했는데 규칙을 준수하지 않았습니다. 오버 플로우 : 필드 세트 규칙에 숨김을 추가했다면 폼이 오른쪽에 잘려나 갔을 것입니다.

출처

2013-12-08 22:38:41

고마워요 @ 크리스! 당신은 너무 많은 도움이되었습니다! – Almazini

당신은 오신 것을 환영합니다. BTW IE 또는 브라우저를 사용하면 F12 도구를 열고 마크 업을 검사하고 CSS 규칙이 적용되는 방법을 확인할 수 있습니다. F12 도구에서 규칙을 편집하고 레이아웃에 어떤 영향을 주는지 확인할 수 있습니다. 매우 편리합니다. –

인터넷 익스플로러의 문제

답변

관련 문제