css問題瓦特/即8和以下

我已經把這個小小的一塊，但我在IE9下方的渲染有問題。css問題瓦特/即8和以下

我一直在討論一堆教程，甚至嘗試了「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及其以下版本無法使用的功能，但對我來說，頭部劃痕就好像整個樣式表已被打破。

請幫忙，謝謝

來源

2011-11-29 Brodie

< ie9不理解你的html5元素：article，footer，section，figure;隨便我只是繼續增加html5.js然後將它們在你的CSS：

文章，圖，剖面圖，頁腳{顯示：塊}

我認爲應該可以解決你在說什麼約

來源

2011-11-29 19:15:00 albert

謝謝albert，我在html5.js中添加了它，看起來不錯，但是這個小切換按鈕並沒有出現在IE8/IE7中。有任何想法嗎？ – Brodie

我看到它在ie9中的功能回滾到兼容性視圖（基本上ie8），但我在win7上......你是不是在本機ie7和ie8中看到它？ – albert

你有很多重複的id的的。每個元素的id必須是唯一的，否則瀏覽器可能會忽略id的後續實例。你也應該申報文件的編碼，其他HTML驗證錯誤中......

http://validator.w3.org

您的網站更容易按預期工作，在所有瀏覽器，當它的HTML代碼完全兼容。

來源

2011-11-29 18:55:07 Sparky

當我做了第一個佈局，我曾使用過Id，因爲它們都是獨一無二的，出於某種原因，我完全沒有注意到這些事實最終會在屏幕上出現多個實例。我要重做它並再次嘗試，非常感謝你提醒我有關驗證器！ – Brodie

它仍然不能正確渲染，但它現在是一個有效的html5頁面！ – Brodie

@Brodie，好吧，至少你不必擔心重複的id被忽略。 – Sparky

css問題瓦特/即8和以下

回答

相關問題