IE8, 7, 6의 목록에 대한 렌더링 오류

Question

IE가 <ul>을 표시하는 요령은 무엇입니까? php 확장자가있는 페이지에서 작업하고 있습니다. 나는 간단한 목록을 가지고있다.

<ul> 
    <li>Stuff one</li> 
    <li>Stuff two</li> 
    <li>Stuff three</li> 
    <li>Stuff four</li> 
</ul> 

Safari와 Firefox에서 제대로 렌더링되는 목록을 얻는 동안 IE에서는 단락 만 표시합니다. 어떤 웹 사이트에서 문제가 될 수 있는지에 대한 일관된 답변을 찾지 못했습니다.

무슨 일입니까?

템플릿은 Matthew James Taylor's 3 column blog 스타일 레이아웃입니다. http://matthewjamestaylor.com/blog/perfect-3-column-blog-style.htm

CSS가 페이지에 올바르게 있습니다. 내가 돌아가서 맨손으로 뼈를 벗을 때도 목록은 표시되지 않습니다.

div 스타일로 인해 CSS가 엉망이 될 가능성이 있습니까?

Answer 1

IE 6,7,8해야 모든 디스플레이 정렬되지 않은 목록을 잘 ...

내 생각 엔 당신이 뭔가 IE에 표시하지 않는 목록을 일으키는 CSS 및/또는 JS로 진행이됩니다.

Answer 2

IE 6에서 제대로 작동합니다. 목록에 CSS가 적용 되었습니까?

Answer 3

아니요, IE는 단락으로 <ul>을 표시하지 않습니다. 다른 무엇인가 잘못되었습니다. IE 관련 CSS가 모양을 변경하는 것이 가능합니까?

Answer 4

코드에 아무런 문제가 없으므로 모든 브라우저 (및 모든 버전)에서 네 가지 항목의 목록을 가져와야합니다. 같은

조건부 (MS의 특정)에 대한 코드를 확인하고, 댓글 :

<!--IE > Hidden code, could be some CSS <![endif]--> 

Answer 5

그것은 당신의 CSS 규칙이 완료되지 않은 것을 수 있습니다. IE와 Opera는 들여 쓰기가 여백 또는 패딩으로 수행되는지 여부와 관련하여 다른 브라우저와 다른 기본 목록 스타일을 다른 방식으로 해석합니다. 스타일을 올바르게 적용하지 않으면 테스트하지 않는 브라우저에서 잘못 표시되는 목록이 생길 수 있습니다.

A List Apart: Articles: CSS Design: Taming Lists

편집 : 그리고이 하나는 CSS에 다음 코드를

Consistent List Indentation

Answer 6

봐 여기에 브라우저의 차이점에 좋은 내용이수록 기사입니다 코드 :

#header ul { 
    clear:left; 
    float:left; 
    width:100%; 
    list-style:none; 
    margin:10px 0 0 0; 
    padding:0; 
} 

#header ul li { 
    display:inline; 
    list-style:none; 
    margin:0; 
    padding:0; 
} 

자세히 알 수 있듯이 규칙이 변경됩니다. 모든 <ul> 및 <li> 요소의 id="header" 요소에있는 여백, 안쪽 여백, 부동 소수점 등을 포함하고 list-style:none;은 목록 항목에서 글 머리 기호를 제거합니다. 진짜 질문은 : 왜 IE만이 CSS 규칙을 존중하겠습니까? 불일치하게 렌더링하는 구문 오류 (실수로 닫는 태그를 삭제 하시겠습니까?)가있을 수 있습니다.