Question

我正在建设的这个网页有10个div类，分为两行（顶部5个，底部5个）。每个都有一个图像里面。 Chrome和Firefox正在正确呈现所有内容，只有一个小文本短语在不应显示时显示为超链接（有关详细信息，请参阅此帖的底部）。这告诉我，我的代码中的某些内容已关闭，但我不能为我的生活找出什么。在FTP将其上传到实际网站之前，一切看起来都很正常。非常感谢帮助。

HTML：

<div id="text-brands">
      <h2 class="blueheader">Learn More About Our Featured Brands</h2>
      <br />
  <div class="featuredBrands">
   <a href="http://www.attvtedetails.com" target="_blank"><img src="images/Brand Logos/ATT.jpg" width="150" height="150" alt="AT&amp;T" /> </a> </div>
    <div class="featuredBrands"><a href="http://www.brotherdetails.com" target="_blank"><img src="images/Brand Logos/BROTHER.jpg" width="150" height="150" alt="Brother" /> </div>
    <div class="featuredBrands"><a href="http://www.dymodetails.com" target="_blank"><img src="images/Brand Logos/DYMO.jpg" width="150" height="150" alt="Dymo" /></div>
    <div class="featuredBrands"><a href="http://www.fujifilmdetails.com" target="_blank"><img src="images/Brand Logos/FUJI.jpg" width="150" height="150" alt="Fuji Film" /> </div>
    <div class="featuredBrands"><a href="http://www.hpdetails.com" target="_blank"><img src="images/Brand Logos/HP.jpg" width="150" height="150" alt="HP" /> </div>
    <div class="featuredBrands"><a href="http://www.imation-memorexdetails.com" target="_blank"><img src="images/Brand Logos/IMATION.jpg" width="150" height="150" alt="Imation" /> </div>
    <div class="featuredBrands"><a href="http://www.kensingtondetails.com" target="_blank"><img src="images/Brand Logos/KENSINGTON.jpg" width="150" height="150" alt="Kensington" /> </div>
    <div class="featuredBrands"><a href="http://www.logitechdetails.com" target="_blank"><img src="images/Brand Logos/LOGITECH.jpg" width="150" height="150" alt="Logitech" /> </div>
    <div class="featuredBrands"><a href="http://www.verbatimdetails.com" target="_blank"><img src="images/Brand Logos/VERBATIM.jpg" width="150" height="150" alt="Verbatim" /> </div>
    <div class="featuredBrands"><a href="http://www.lexmarkdetails.com" target="_blank"><img src="images/Brand Logos/LEXMARK.jpg" width="150" height="150" alt="Lexmark" /> </div>

<br />
<br />
<br />
</div>

CSS：

#text-brands {
   width: 925px;
   float: left;
   padding-top: 30px;
   padding-right: 10px;
   padding-bottom: 20px;
   padding-left: 20px;
 }

.featuredBrands {
   margin: 0px;
   padding: 10px;
   float: left;
   width: 150px;
   border: 5px solid #EAEAEA;
   clear: none;
   height: 150px;
   overflow: hidden;
}

以下是我遇到问题的链接：http://www.officesolutions.com/technology-products.html

最后一个问题（如果有人可以提供帮助，我真的只是认为这是奖金）。页面底部的“产品类别”最左边的类别是渲染为超链接（具体来说，lexmark徽标的链接应该是直接到）。我无法弄明白，因为该短语附近没有任何标记。它应该是一个标题，但由于某种原因显示为一个链接。

HTML：

<div id="content-bottom">
          <div id="sitelinks">
            <div class="column" style="border-left: none;">
              <p><strong>Product Categories</strong></p>
              <ul>
                <li><a href="office-supplies.html">Office Supplies</a></li>
                <li><a href="furniture-space-planning.html">Furniture &amp; Space Planning</a></li>
                <li><a href="facility-maintenance-supplies.html">Facility &amp; Maintenance Supplies</a></li>
                <li><a href="coffee-services.html">Coffee Services</a></li>
                <li><a href="printing-promotional-products.html">Printing &amp; Promotional Products</a></li>
                <li><a href="technology.html">Technology</a></li>
              </ul>
            </div>
         </div>
      </div>

Answer 1

我很困惑第二个和第一个问题接缝是相同的链接结束？在实际问题中，IE9中的显示问题无法看到任何内容？

第二个问题在检查代码时，该列表中的任何链接都没有结束标记。

您可能没有最新版本，或者可能因某些非常奇怪的原因而被剥离。

代码原样：

 <div class="featuredBrands"><a href="http://www.attvtedetails.com" target="_blank"><img src="images/Brand Logos/ATT.jpg" width="150" height="150" alt="AT&amp;T" /> </a> </div>
        <div class="featuredBrands"><a href="http://www.brotherdetails.com" target="_blank"><img src="images/Brand Logos/BROTHER.jpg" width="150" height="150" alt="Brother" /> </div>
        <div class="featuredBrands"><a href="http://www.dymodetails.com" target="_blank"><img src="images/Brand Logos/DYMO.jpg" width="150" height="150" alt="Dymo" /></div>
        <div class="featuredBrands"><a href="http://www.fujifilmdetails.com" target="_blank"><img src="images/Brand Logos/FUJI.jpg" width="150" height="150" alt="Fuji Film" /> </div>
        <div class="featuredBrands"><a href="http://www.hpdetails.com" target="_blank"><img src="images/Brand Logos/HP.jpg" width="150" height="150" alt="HP" /> </div>
        <div class="featuredBrands"><a href="http://www.imation-memorexdetails.com" target="_blank"><img src="images/Brand Logos/IMATION.jpg" width="150" height="150" alt="Imation" /> </div>
        <div class="featuredBrands"><a href="http://www.kensingtondetails.com" target="_blank"><img src="images/Brand Logos/KENSINGTON.jpg" width="150" height="150" alt="Kensington" /> </div>
        <div class="featuredBrands"><a href="http://www.logitechdetails.com" target="_blank"><img src="images/Brand Logos/LOGITECH.jpg" width="150" height="150" alt="Logitech" /> </div>
        <div class="featuredBrands"><a href="http://www.verbatimdetails.com" target="_blank"><img src="images/Brand Logos/VERBATIM.jpg" width="150" height="150" alt="Verbatim" /> </div>
        <div class="featuredBrands"><a href="http://www.lexmarkdetails.com" target="_blank"><img src="images/Brand Logos/LEXMARK.jpg" width="150" height="150" alt="Lexmark" /> </div>

Answer 2

您缺少在第一个代码块的图像末尾关闭锚标记。添加它们可以解决您的问题。一些其他浏览器考虑到这样的错误并自动适当地呈现，而IE则没有。您还可以通过W3C标记验证器运行代码，它会告诉您一堆错误在哪里。

无法在IE9中正确渲染div

2 个答案: