스팬은 ie6에서 h1과 정렬되지 않습니다

Question

div 안에 하나의 h1 태그와 그 뒤에 다른 스팬 태그가 있지만 스팬은 오른쪽으로 떠 있습니다. 파이어 폭스, 크롬 및 인터넷 익스플로러 7과 8에서는 작동하지만 ie6에서는 작동하지 않습니다. ie6에서는 h1 태그가 아무런 이유없이 더 커지므로 span 태그는 계속해서 그 태그를 찾습니다.

을 Heres 코드 :

 <div style="width: 740px; float:left"> 

     <div id="article-header"> 

      <h1><span>Text</span></h1> 

      <span class="breadcrumb">Link1 > Link2</span> 

     </div> 

는 CSS : 당신은 CSS Reset File을 사용해야 할 수도

#article-header h1 
    { 
    font-family: Verdana, Arial, Helvetica, sans-serif; 
    font-size: 10px; 
    font-weight: bold; 
    color: #F2612F; 
    text-transform: uppercase; 
    display: inline; 
    position: relative; 
    } 
    .breadcrumb 
    { 
    font-family: Verdana, Arial, Helvetica, sans-serif; 
    font-weight: bold; 
    font-size: 9px; 
    float: right; 
    text-transform: uppercase; 
    vertical-align: baseline; 
    margin-top: 0px; 

    text-align: right; 
    display: inline; 
    } 

Answer 1

는 IE6에서 무작위로, 미리 정의 된 스타일을 제거합니다. 이렇게하면 한 브라우저에서 다음 브라우저로 변경되는 모든 종류의 "은폐"스타일이 제거됩니다.

#article-header h1{ 
    display: inline; 
} 

:

Answer 2

당신이 정말로 다음, 어떤 이유로 float:left를 사용 IE6 만 스타일이 추가 시도해야하는 경우 단지 display:inline

를 사용 H1에 float:left를 사용하지 마십시오

렌더링에 부정적인 영향을 미치지 않아야하지만 IE6의 부동 소수점과 결합 된 효과는 일반과 다릅니다 display:inline