UL對齊問題HTML

我在HTML電子郵件中創建一個列表，UL對齊問題HTML

<table width="220" border="1" cellspacing="0" cellpadding="0" bgcolor="#ffffff"> 
    <tr> 
    <td width="20"></td> 
    <td width="180"> 
     <p style="color:#333333; line-height: 20px; font-size: 16px; font-family: Helvetica, Arial, sans-serif; font-weight:bold; text-align: left; padding-top: 10px;">Title</p> 
     <ul style="color:#767676; line-height: 20px; font-size: 12px; font-family: Helvetica, Arial, sans-serif; list-style-image:url(images/bullet.jpg);"> 
     <li>Contrary to popular belief, Lorem Ipsum is not simply random text. </li> 
     <li>Contrary to popular belief, Lorem Ipsum is not simply random text. </li> 
     <li>Contrary to popular belief, Lorem Ipsum is not simply random text. </li> 
     </ul> 
    </td> 
    <td width="20"></td> 
    </tr> 
</table>

但是，該列表並不與上面的標題對齊。我如何對齊它們？

來源

2011-05-18 user1212

確定爲什麼它獲得了-ve投票？ – user1212 2011-05-18 17:14:56

以及內聯樣式不完全是最好的做法...但我知道這是一個電子郵件模板，你可能需要他們... – pixelbobby 2011-05-18 17:16:28

所以你的觀點是？ HTML電子郵件不允許標題中的css – user1212 2011-05-18 17:18:37

添加padding:0你的CSS樣式您UL和可選list-style-position:inside;如果你想包括在文本中，而不是外側（左側）的子彈。

<ul style="color:#767676; line-height: 20px; font-size: 12px; font-family: Arial, sans-serif; list-style-image:url(images/bullet.jpg);list-style-position:inside;padding:0;">

來源

2011-05-18 17:21:57 Rudu

看我的更新小提琴http://jsfiddle.net/KM9Wk/1/。

我更新了你的<html>的代碼。不知道爲什麼你的側面有空的<td>標籤。我只是用padding代替。「標題」也正確對齊。

來源

2011-05-18 17:15:42 pixelbobby

這並沒有解決我的問題，子彈點已經消失，它仍然沒有對齊 – user1212 2011-05-18 17:17:40

子彈不會顯示，因爲這些圖像不在** JSFiddle **服務器上... – pixelbobby 2011-05-18 17:20:44

UL對齊問題HTML

回答

相關問題