css problems w/ie 8 이하

Question

이 작은 작은 조각을 조립했지만 IE9 이하의 렌더링에 문제가 있습니다.

나는 많은 튜토리얼을 살펴 보았지만 "html shiv"기법의 버전을 사용해 보았지만 아무 소용이 없었다.

무엇이 문제인지 잘 모르겠습니다. 나는 그것을 십자가에서 테스트했고 IE8 이하를 제외한 거의 모든 브라우저에서 작동합니다. 나는 IE8의 전체 스타일 시트를 재 작업해야하고, 무리가없는 경우 궁금하다.

IE8/IE7/IE6에서는 버튼의 호버 상태가 작동하지만 모든 경계가 사라지는 것처럼 보입니다.

http://www.brodieyazaki.com/matt_tiles

라이브 작업 버전입니다.

여기에 HTML이 있습니다 (CSS는 포함하지만 길긴하지만 불편을 끼쳐 드려 죄송합니다).

<section id="tile"> 
    <button id="toggle_button"></button> 
    <section id="tile_content"> 
     <figure id="tile_content_figure" class="clearfix"> 
      <img src="imgs/tile_pic.png"> 
      <h1> 
       &#8220;Siri's Default Settings Leave 
       Your iPhone 4S Exposed&#8221; 
      </h1> 
     </figure> 

     <div id="tile_content_link"> 
      <p id="from_in"> 
       From <a href="#">nytimes.com</a> in <a href="#">arab spring</a> 
      </p> 
     </div> 

     <div id="tile_content_comment" class="clearfix"> 
      <img src="imgs/user_img.png"> 
      <p> 
       "This is the basic version of the tile" 
      </p> 
     </div> 
    </section> 

    <footer id="tile_foot"> 
     <div id="foot_wrap" class="clearfix"> 
      <figure class="like_view"> 
       <img src="imgs/like.png"> 
       <span>10</span> 
      </figure> 
      <figure class="like_view"> 
       <img src="imgs/view.png"> 
       <span>100</span> 
      </figure> 
      <article id="social" class="clearfix"> 
       <button id="facebook"></button> 
       <button id="tumblr"></button> 
       <span>share</span> 
      </article> 
     </div> 
    </footer> 
</section> 

올바른 방향으로 향하게하려고합니다. 나는 CSS에 IE8 이하의 픽업 기능이 없다는 것을 알고 있지만, 나를 위해 머리를 쓰는 사람은 스타일 시트 전체가 망가져있는 것처럼 보인다.

은 도움을 주시기 바랍니다, 그리고 당신은 중복 id 년대의 제비가

Answer 1

< ie9는 html5 요소를 이해하지 못합니다. article, footer, section, figure; 난 그게 당신이 무슨 말을 수정해야한다고 생각 : {블록 디스플레이}

: 즉석 난 그냥 html5.js를 추가 가서 다음 CSS에서 전원을 켜십시오 것

글, 그림, 섹션, 바닥 글 about

Answer 2

당신에게 감사합니다. id은 요소별로 고유해야하며 브라우저는 id의 후속 인스턴스를 무시할 수 있습니다. HTML 코드가 완벽하게 준수하는 경우에도,

http://validator.w3.org

귀하의 사이트가 예상대로 모든 브라우저에서 작동 할 가능성이 높습니다 ... 다른 HTML 유효성 검사 오류 중 문서 인코딩을 선언해야합니다.