html - 如何强制文本出现在换行符的左侧？

Question

我有一个 <td>嵌套 <p> .当文本超过最大长度时，它会在新行上从右到左打印剩余的文本。

如何解决这个问题，使新行从右到左开始打印？ 这是我的代码:

.group {
  border: 2px solid #FFCC00;
  min-width: 250px;
  width: 32.85%;
  margin-bottom: 5px;
  margin-left: 5px;
  padding: 3px;
  float: left;
}

.group article {
  padding: 5px;
  max-height: 350px;
  overflow: auto;
}

.group article table {
  width: 100%;
  border-spacing: 7px;
}

<div class="group">
  <article>
    <header> Links</header>
    <hr/>
    <section>
      <table>
        <tbody>
          <tr>
            <td>
              <p><a href="example.com/" target="_blank">Click here</a></p>
            </td>
            <td>
              <p>Description </p>
            </td>
          </tr>
        </tbody>
      </table>
    </section>
  </article>
</div>

Answer 1

使用:

text-align: right;

将按照您的示例使文本与右侧对齐。

.group {
  border: 2px solid #FFCC00;
  min-width: 250px;
  width: 32.85%;
  margin-bottom: 5px;
  margin-left: 5px;
  padding: 3px;
  float: left;
}

.group article {
  padding: 5px;
  max-height: 350px;
  overflow: auto;
}

.group article table {
  width: 100%;
  border-spacing: 7px;
}

td.right p{
  text-align:right;
}

<div class="group">
  <article>
    <header> Links</header>
    <hr/>
    <section>
      <table>
        <tbody>
          <tr>
            <td>
              <p><a href="example.com/" target="_blank">Click here</a></p>
            </td>
            <td class="right">
              <p>Description lorem ipsum dollar sit amet</p>
            </td>
          </tr>
        </tbody>
      </table>
    </section>
  </article>
</div>