html - 使用 Rails 进行敏捷 Web 开发示例在文本上显示图像

Question

我正在读一本书（Agile Web Development With Rails），我在第 96 页遇到了问题。

我完全坚持书中的代码，但我明白了。

我知道解决此问题的另一种方法是使用表格，但我想先知道是否有其他解决方案。

Answer 1

使图像高于文本的是您的 CSS规则position: absolute;。img查看帮助

Answer 2

我会使用 div 来组织这些评论。第一个容纳图像和评论的 div。容纳图像的第二个 div。第三个是评论。

的HTML：

<div class="comment-container">

  <div class="comment-img">
    <!whatever code you use to pull images from the database>
  </div><!ENDcomment-img>

  <div class="comment-field">
    <!whatever code you use to pull comment content from the database>
  </div><!ENDcomment-field>

</div><!ENDcomment-container>

CSS：

 .comment-container{
     padding: 5px; 
     border-bottom: 1px dashed #009fe4; 
     margin: 2px 0 5px 0;
  }

 .comment-img{
     float: left;
     width: 80px;
     height: auto;
  }

 .comment-field{
     width: 700px;
     height: auto;
     padding: 0 0 0 10px;
  }

我希望这会有所帮助。

@subm0ral