html - 无法将此文本移至左侧

Question

我试图将“大约 15 小时前”文本移至左侧，但似乎无法完成。向左浮动似乎不起作用，而且我无法减少左边距，因为那样“3 分钟前”文本会与图像发生冲突。

这是 html(很抱歉弄得一团糟):

<div class="comment_column_narrow">
    <div id="comment_title_39" class="comment_title">
        Do you like this song?

        <a href="/comment_titles/39" class="comment_title_delete" data-method="delete" data-remote="true" rel="nofollow">x</a>
    </div>


    <div class="comment_content">
          <a href="/profiles/45" class="comment_image"><img alt="Justin meltzer" src="/system/photos/45/tiny/Justin Meltzer.jpeg?1302075215"></a>
          <div class="textual_comment_content">
              <div class="comment_text">
                 <span class="name_link">
                     <a href="/profiles/45" class="normal">Justin Meltzer</a>
                 </span>
             Ok so this is what I think about this song: You need to switch back to your roots. You started as a rapper, and you need to remain a rapper. I respect you for your initiative to improve your flexibility but please stick to your roots. That's what makes you truly great.
              </div>
               <span class="comment_footer">
             <ul>
            <li class="list_style">about 15 hours ago.</li>
         </ul>
           <span>
      </span></span></div></div></div>

这是相应的 CSS:

.comment_column_narrow {
    float: left;
    width: 295px;
    margin-right: 5px;
}

.comment_content{
    clear:both;
    padding: 10px 5px;
    border-top:2px solid #E2E2E2;
    border-right:3px solid #E2E2E2;
}

.comment_text{
    line-height: 120%;
}

.comment_image{
    float:left;
    margin-right: 10px;
}

.comment_footer{

}

.comment_footer ul{
   margin-top: 5px;
}

.comment_footer ul li{
    font-size: 10px;
    color:gray;
    float:left;
    margin-right:25px;
}

.list_style{
    list-style:none;
}

.name_link{
     margin-left:-3px;
}

Answer 1

代替

这个:

<div class="comment_text">
    <span class="name_link">
        <a href="/profiles/45" class="normal">Justin Meltzer</a>
    </span>
    Ok so this is what I think about this song: You need to switch back to your roots. You started as a rapper, and you need to remain a rapper. I respect you for your initiative to improve your flexibility but please stick to your roots. That's what makes you truly great.
</div>
<span class="comment_footer">
    <ul>
        <li class="list_style">about 15 hours ago.</li>
    </ul>
</span>

将 comment_footer 跨度移动到 comment_text 跨度内，以便它按照您的需要环绕图像。然后删除 <ul>和 <li>因为他们只是在妨碍你。你最终得到:

<div class="comment_text">
    <span class="name_link">
        <a href="/profiles/45" class="normal">Justin Meltzer</a>
    </span>
    Ok so this is what I think about this song: You need to switch back to your roots. You started as a rapper, and you need to remain a rapper. I respect you for your initiative to improve your flexibility but please stick to your roots. That's what makes you truly great.
    <span class="comment_footer">about 15 hours ago.</span>
</div>