如何使文本在换行处对称排列

Question

我有一个引导表，里面有一个链接和一个字体很棒的图标

这个引导表也在引导列中。当下一行太长时，会出现换行符，文本会在下一行继续。

然而，我希望文本在与上面的文本直接对齐的地方开始继续。

现在，文本断开，正好落在最左边的字体图标下面。

这是我的密码。

<div class="our-story-pt-6">
  <div class="container">
    <h4>More Information</h4>
    <div class="more-info">
      <div class="col-md-6">
        <table class="table">
          <tbody>
            <tr>
              <td class="more-info-link">
                <i class="fa fa-file-text-o"></i>
                <a href="#">Life Sciences Overview</a>
              </td>
            </tr>
            <tr>
              <td>
                <i class="fa fa-file-text-o"></i>
                <a class="text-left" href="#">Transforming Research Operations Through Strategy and Technology Overview</a>
              </td>
            </tr>
            <tr>
              <td>
                <i class="fa fa-file-text-o"></i>
                <a href="#">Commercial Launch Overview</a>
              </td>
            </tr>
            <tr>
              <td>
                <i class="fa fa-file-text-o"></i>
                <a href="#">Webinar: Preparing Your Company for a Successful Commercial Launch</a>
              </td>
            </tr>
            <tr>
              <td>
                <i class="fa fa-file-text-o"></i>
                <a href="#">Supply Chain Management Overview</a>
              </td>
            </tr>
          </tbody>
        </table>
      </div>
      <div class="col-md-6">
        <table class="table">
          <tbody>
            <tr>
              <td class="more-info-link">
                <i class="fa fa-file-text-o"></i>
                <a href="#">IT Strategy - Emerging Overview</a>
              </td>
            </tr>
            <tr>
              <td>
                <i class="fa fa-file-text-o"></i>
                <a href="#">IT Strategy - Established Overview</a>
              </td>
            </tr>
            <tr>
              <td>
                <i class="fa fa-file-text-o"></i>
                <a href="#">LS Information Management Overview</a>
              </td>
            </tr>
            <tr>
              <td>
                <i class="fa fa-file-text-o"></i>
                <a href="#">Case Studies</a>
              </td>
            </tr>
          </tbody>
        </table>
      </div>
    </div><!-- end div.more-info -->
  </div><!-- end div.container -->
</div><!-- end div.our-story-pt-6 -->

提前谢谢。

Answer 1

将您的div包装在单独的div中。这将迫使标记的任何溢出流到标记本身的开头下方。