UL выравнивания вопроса HTML - PullRequest
0 голосов
/ 18 мая 2011

Я создал список в 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>

Однако список не соответствует заголовку выше. Как мне их выровнять?

Ответы [ 2 ]

1 голос
/ 18 мая 2011

Добавьте 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;">
1 голос
/ 18 мая 2011

Смотрите мои обновленные скрипка http://jsfiddle.net/KM9Wk/1/.

Я обновил ваш <html> код. Не уверен, почему у вас были пустые <td> теги по бокам. Я просто использовал padding вместо этого. «Заголовок» также правильно выровнен.

...