html - 浮动左容器挂在中间

Question

我有以下代码：http: //jsfiddle.net/69MqZ/1/

如您所见，灰色文本行到灰色元数据：

尽管左边的名字很长，但我希望它是这样的：

显然，它必须使用 position: relative 或某种使边界底部相应移动的技术。这是 WordPress 生成的评论输出。

我在这里面临同样的问题（所有容器都有浮动：左；）：

Answer 1

您将需要在评论作者姓名和元数据周围包裹一个父元素- .comment-author 和 .comment-meta - 然后浮动该父元素。例如：

 <div class="comment_author_wrap">
 <div class="comment-author vcard">
     <cite class="fn">John Smith</cite> <span class="says">says:</span>        
 </div>

 <div class="comment-meta commentmetadata">
     <a href="#comment-3">May 23, 2010 at 5:04 pm</a>&nbsp;&nbsp;<a title="Edit comment" href="3" class="comment-edit-link">(Edit)</a>        
 </div>
 </div>

然后

.comment_author_wrap {
   float: left;
 }

这将允许评论文本像您想要的那样一直出现在该区域的顶部。