IE8 WordPress的網站兼容性問題 - 側邊欄顯示頁面底部

我有這個網站http://www.basketballworkouttips.com/jump-manual-review/和問題是，當在IE8中查看側邊欄被推到頁面的底部。但是，如果我從頁面中刪除了審閱框，則側欄顯示正常。我想保留審閱框但我不希望我的側欄被壓下。IE8 WordPress的網站兼容性問題 - 側邊欄顯示頁面底部

任何想法如何解決這個問題？

這裏的審查框代碼

<div class="review"> 
    <div itemtype="http://schema.org/Product" itemscope=""> 
    <div itemtype="http://schema.org/Review" itemscope=""> 
     <div class="ta_rating_container ta_box_right" style="width:240px;"> 
     <div id="ta_rating"> 
      <div> 
      <div>Review of: 
       <span class="title item fn" itemprop="name"> 
       <a onclick="_gaq.push(['_trackEvent', 'Affiliate Clicks', 'Jump Manual', '/jump-manual-review/-Review Box Link',, false]);" rel="nofollow" href="http://www.basketballworkouttips.com/go/jumpmanual" title="Jump Manual">Jump Manual</a> 
       </span> 
      </div> 
      <div class="clear"></div> 
      <dl> 
       <div class="clear_space"></div> 
       <div class="hr"><hr /></div> 
       <div>Reviewed by: 
       <span class="reviewer author byline vcard hcard"> 
        <span class="author me fn" itemprop="author">Jesse Parker</span> 
       </span> 
       </div> 
       <dl> 
       <dt>Rating:</dt> 
       <dd> 
        <div class="ta_rating result rating" itemtype="http://schema.org/Rating" itemscope="" itemprop="reviewRating"> 
        <meta content="1" itemprop="worstRating"> 
        <meta content="5" itemprop="ratingValue"> 
        <meta content="5" itemprop="bestRating"> 
        <div class="result" style="width:100%;" title="5">5</div> 
        </div> 
       </dd>  
       </dl> 
       <div class="clear"></div> 
       <div class="clear_space"></div> 
       <div class="hr"><hr /></div> 
       <h3>Summary:</h3> 
       <div class="ta_description summary" itemprop="description"> 
       <p> 
        <span>The Jump Manual is an effective program that will help you increase your vertical leap. The program is easy to follow and provides one on one coaching from it's author + exclusive 60 day money back guarantee. if you're looking to increase your vertical this program is the best one to go for. 
        </span> 
       </p> 
       </div> 
      </div> 
      <div class="rating_btn"> 
       <a onclick="_gaq.push(['_trackEvent', 'Affiliate Clicks', 'Jump Manual', '/jump-manual-review/-Review Box Button',, false]);" itemprop="url" class="ar_button ar_orange" href="http://www.basketballworkouttips.com/go/jumpmanual" title="Download Jump Manual" rel="nofollow">Download Jump Manual</a> 
      </div> 
      <div class="clear"></div> 
      </div> 
     </div> 
     <div itemprop="reviewBody"> 
     <div itemtype="http://schema.org/Thing" itemscope="" itemprop="itemReviewed"> 
      <meta content="Jump Manual" itemprop="name"> 
     </div>

來源

2013-09-28 Smoker

這看起來像一個嵌套問題。您的側邊欄與#content位於同一個塊元素中。因此花車將無法正常工作。 FireFox和其他瀏覽器很可能會自動糾正它，但IE8是有限的，不會猜測工作來協助。

我會通過放置#sidebar_wrap_right並將其置於與#content相同的級別來更正此問題。然後一定要在CSS中添加一個寬度，然後浮動兩個div，並根據需要添加margin/padding。

我也從來沒有看到下面的標記是渲染，也有可能你有一些無效的HTML和CSS。

<css3-container style="z-index: auto; position: absolute; direction: ltr; top: 5500px; left: 28px;">

來源

2013-09-28 04:19:08 googabeast

此外，我看到過量的重要裝飾！這些只應在100％需要時才使用，並且設計的簡單性看起來像對抗每種定義的風格而不是擁抱它們。 – googabeast

IE8 WordPress的網站兼容性問題 - 側邊欄顯示頁面底部

回答

相關問題