2010-05-07 5 views
1

저는 현재 작업중인 프로젝트와 관련된 질문을 통해 규칙을 위반하지 않았 으면합니다. 내 페이지 here을보고 Firefox 및 Internet Explorer에서 다시 볼 경우 주 콘텐츠 상자의 너비가 다릅니다. Firefox에서는 모든 것이 페이지 상단의 광고와 완벽하게 일치하지만 IE에서는 콘텐츠 상자의 너비가 약 20 픽셀 정도 짧아집니다.IE와 FF 사이의 CSS 차이점

내 질문은 분명하지만 지금 IE의 너비가 짧아지는 원인과 간단한 해결책은 무엇입니까?

내가 다른 사람들에게 도움이 될만큼 충분히 일반적인 것이 아닌 질문을함으로써 규칙을 어 기고 있다면, 나는 그것을 바꿔 말할 수 있습니다. 브라우저 간의 시각적 차이를 해결하는 가장 좋은 방법은 무엇입니까? IE 용으로 별도의 CSS 파일을 사용해야합니까, 아니면 특정 브라우저에서만 렌더링되는 CSS 파일에 줄을 정의 할 수있는 방법이 있습니까?

누군가가 필요한 CSS를 제공하여 적절하게 정렬하는 것이 가장 좋지만 가능한 경우 CSS를 동적으로 만드는 방법에 대해 자세히 배우는 것이 더 행복 할 것입니다.

모두에게 감사드립니다. :)

+0

를 사용하여. (귀하의 프로젝트에 NDA가 없다면) – SLaks

+0

좋습니다. 그것은 내가하고있는 개인 프로젝트입니다. 학교 나 직장을위한 것이 아닙니다. –

답변

8

귀하의 HTML은 형식이 올바르지 않습니다. <html>이 필요하고 < 제목이 > 인 것은 < 머리 >이어야합니다. 가장 중요한 점은 렌더링 할 때 브라우저가 단조 모드가 아닌 표준 모드를 ​​사용하도록 DOCTYPE이 필요하다는 것입니다. 쿼크 모드는 폭이 다른 원인입니다.

HTML 5 doctype은 <! DOCTYPE html >이며 HTML 파일의 첫 번째 줄이어야합니다. 다음은 최소 HTML 파일입니다.

<!DOCTYPE html> 
<html> 
    <head> 
     <title>Document</title> 
    </head> 
    <body> 
    </body> 
</html> 
+0

와우! ++++! 을 추가하면 즉시 문제가 해결되었습니다. 그것은 몇 가지 다른 원치 않는 부작용을 일으켰지 만 해결할 산들 바람 것입니다; 적어도 이제는 두 브라우저에서 모두 동일하게 보입니다. –

+0

다시 한 번 감사드립니다. 작은 시각적 차이를 없애기 위해 내가 얼마나 오랫동안 노력하고 있는지 알 수 없습니다. 나는 doctype이 아주 강력하다는 것을 전혀 몰랐습니다. –

+0

@Joe - Firefox를 사용하는 경우 HTMLTidy 플러그인이 유용하다는 것을 알게 될 것입니다. http://users.skynet.be/mgueury/mozilla/ – indiv

0

시도 당신은 규칙을 위반하지 않는

box { 
    width: 100%; 
} 
관련 문제