0

私はこのウェブサイトhttp://www.basketballworkouttips.com/jump-manual-review/を持っていますが、問題は、IE8 で表示すると、サイドバーがページの一番下に押し下げられることです。ただし、ページからレビュー ボックスを削除すると、サイド バーは正常に表示されます。レビュー ボックスは残しておきたいのですが、サイド バーを押し下げたくありません。

これを修正する方法はありますか？

レビューボックスコードはこちら

<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>
4

1 に答える 1

1

これはネスティングの問題のようです。サイドバーは #content と同じブロック要素内にあります。したがって、フロートは適切に機能しません。FireFox やその他のブラウザーはおそらく自動修正を行っていますが、IE8 は制限があり、推測作業を支援するものではありません。

#sidebar_wrap_right を #content と同じレベルに配置することで問題を修正します。次に、CSS で両方に幅を追加し、必要に応じて余白/パディングを追加して 2 つの div をフロートさせます。

また、以下のタグがレンダリングされているのを見たことがありません。無効な HTML と CSS も含まれている可能性があります。

<css3-container style="z-index: auto; position: absolute; direction: ltr; top: 5500px; left: 28px;">
于 2013-09-28T04:19:08.003 に答える