将定位为帖子标题下方

Question

这是我的第一次网站尝试，我一直在遵循一个很棒的教程，同时尝试以某些方式做我自己的事情。我学到了很多东西，但遇到了一个问题。

该页面位于 http://thelifefilm.com/

侧面的“帖子图块”目前有边距 -顶部来定位它们。这非常有效，直到最后一篇文章延伸到第二行。那么我该如何工作才能使

始终位于帖子标题下方 15px 处。

顺便说一句，如果有人能解释一下如何将我的“评论数字”完全集中在小气泡中，因为目前它只对某些数字看起来不错。

如果当我偏离教程时，我的代码在受过训练的眼睛看来很奇怪，请提前致谢并致歉。

Answer 1

目前

位于

之外。将图块放在文章正文内的 h1 标记下方。移除图块上的上边距。将链接到单个帖子的图块和图片包裹在另一个 div 中。将图块向左浮动，将单个帖子图像向右浮动。

建议的结构：

<div class="articleBody">
    <h1>Post Title</h1>
    <div class="below-title-wrap">
         <div class="tile">...</div>
         <a href="blog-single.html">
              <img src="http://lorempixum.com/495/125/technics" alt="Tech">
         </a>
    </div>
</div>

让我添加一条编辑内容，出于 SEO 原因，建议每页不要使用多个

标记。我将它们分别设置在 single.php 中的

和

中，分别在单个帖子页面上。

Answer 2

CSS：

* { margin:0; padding:0 }
h2 { padding-left:115px; margin-bottom:15px }
.tile { width:100px; height:100px; float:left; margin:0 15px 15px 0 }

HTML：

<div class="article">
    <h2>Lorem ipsum dolor sit amet</h2>
    <p><img class="tile" src="tile.gif" alt="" /></p>
    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit...</p>
</div>