不能得到這個文本到左邊

enter image description here 不能得到這個文本到左邊

我試圖獲得「約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; 
}

來源

2011-04-06 Justin Meltzer

鉻10和Firefox 4，在Ubuntu 10.10，似乎顯示，你需要：貼JS提琴演示代碼（http://jsfiddle.net/davidThomas/Yxepd/）。您使用哪個瀏覽器/平臺？ – 2011-04-06 20:52:09

您可以發佈反饋的HTML/3分鐘前的部分......也許這兩者之間有些不同，因爲它看起來不像是動態的。此外，我不知道爲什麼你使用一個span的comment_footer與嵌套ul而不是隻使用div和刪除ul/li。 – 2011-04-06 20:53:33

Im在Mac 0SX和Chrome 10上 – 2011-04-06 20:55:44

而不是

這樣的：

<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 s平移在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>

來源

2011-04-06 20:58:25 ohmusama

嘗試改用註釋部分，以這樣的：

<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"> 
       <a href="/profiles/45" class="normal name_link">Justin Meltzer</a> 
       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> 
      <div class="comment_footer"> 
       about 15 hours ago. 
      </div> 
     </div> 
    </div>

來源

2011-04-06 21:00:10

不能得到這個文本到左邊

回答

相關問題