css - CSS Faux Column 布局有问题——背景栏图像没有出现

Question

如前所述，我正在尝试使用人造列方法来获得匹配高度的列。我遵循了 CSS: The Missing Manual 中列出的方法，它与我在 ALA 和其他在线资源上看到的所有内容相匹配。我遇到的问题是虚假的柱状图像从未出现在屏幕上。这是我正在使用的 HTML:

<div id="contentWrapper">
  <div id="reports">   
    <h2>yyyy</h2>  
    <p>xxxxx</p>                               
  </div>

  <div id="webApps">
    <h2>yyyy</h2>
    <p>xxxxx</p>
  </div>

  <div id="resources">
    <h2>yyyy</h2>
    <p>xxxx</p>
  </div>

  <div id="footer">
    <hr style="text-decoration:dotted" />
    <p> xxxx </p>
  </div>
</div>

还有 CSS:

#contentWrapper {   
  background: url(fauxcolumn.png) repeat-y left top;
}
#reports {
  width: 300px;
  float: left;
  font-size: 11px;
}
#webApps {
  width: 150px;
  float:left;
  margin: 21px 100px 0px 80px;
}
#resources {
  width: 210px;
  float: left;
  text-align:left;
  margin-top: 21px;
}
#footer {
  clear:both;
  text-align: center;
  font-size: smaller;
  color: darkgray;
}

Answer 1

摘自评论:您确定图片链接正确吗？确保 fauxcolumn.png 与您的页面/样式表位于同一目录级别。