Html CSS:Border top won'；我不能正常工作

我正在使用引导，我正在尝试修复边界。由于左右拉动，它将仅显示在文本上方。我应该怎么做才能使它出现在整条线上

HTML

---

如果确实希望文本1和文本2各占div的一半，请尝试将页脚标记作为一个元素整体放在所有列上，然后将文本1和文本2嵌套在两个div中，其中列为6

如下更改代码：

<footer class="container">
  <div class="row">
    <div class="col-md-6">
      <div class="pull-left">
          <p>text1</p>
        </div>
        </div>
    <div class="col-md-6">
      <div class="pull-right">
        <p>text2</p>
      </div>
    </div>
  </div>
</footer>

文本1

文本2

基本上，您去掉了双

页脚

元素，并将

容器

类应用于

页脚

元素，这样它可以扩展整个宽度，并在调整大小时保持为单个

页脚

这解决了您的问题，并且在语义上是正确的，因为您没有2个

footer

元素

我添加了一个标记，这样您就可以看到它是如何工作的

如果不更改标记，您将无法使用它

给页脚行另一个fitting类：

footer row

并对其应用样式更有意义：

HTML

<div class="container">
  <div class="row footer-row">
    <div class="col-md-6">
      <div class="pull-left">
          <footer class="footer"><p>text1</p></footer>
        </div>
        </div>
    <div class="col-md-6">
      <div class="pull-right">
         <footer class="footer"><p>text2</p></footer>
      </div>
    </div>
  </div>
</div>

---

如果将footer类放在行div上会怎么样？有点不错，文本现在被压缩了text-text-text

text-text-tex

我想你不再需要左拉右拉，试着把它们拿出来？如果你想将文本居中对齐，你应该可以将它们的父div文本居中对齐。@Devin说你可以把页脚放进去使用容器类。。。

<footer class="container">
  <div class="row">
    <div class="col-md-6">
      <div class="pull-left">
          <p>text1</p>
        </div>
        </div>
    <div class="col-md-6">
      <div class="pull-right">
        <p>text2</p>
      </div>
    </div>
  </div>
</footer>

<div class="container">
  <div class="row footer-row">
    <div class="col-md-6">
      <div class="pull-left">
          <footer class="footer"><p>text1</p></footer>
        </div>
        </div>
    <div class="col-md-6">
      <div class="pull-right">
         <footer class="footer"><p>text2</p></footer>
      </div>
    </div>
  </div>
</div>

.footer-row {
    padding-top: 19px;
    margin-top: 7px;
    color: #777;
    border-top: 1px solid #e5e5e5;
}