html - Bootstrap出于某种原因在 a 内垂直移动文本 - 如何解决这个问题？

Answer 1

有一个简单的修复：http: //jsfiddle.net/Wexcode/uC5ax/

变化vertical-align: top_.table td

.table th,
.table td {
  padding: 8px;
  line-height: 18px;
  text-align: left;
  vertical-align: top;
  border-top: 1px solid #dddddd;
}

到vertical-align: text-bottom

.table th,
.table td {
  padding: 8px;
  line-height: 18px;
  text-align: left;
  vertical-align: text-bottom;
  border-top: 1px solid #dddddd;
}

Answer 2

保持表格格式的更好解决方案是简单地从以下位置删除有问题的行：

.table {
  width: 100%;
  max-width: 100%;
  margin-bottom: @line-height-computed;
  > thead,
  > tbody,
  > tfoot {
    > tr {
      > th,
      > td {
        padding: @table-cell-padding;
        line-height: @line-height-base;
        vertical-align: top;
        border-top: 1px solid @table-border-color;
      }
    }
  }
  > thead > tr > th {
    vertical-align: top;
    border-bottom: 2px solid @table-border-color;
  }
  > caption + thead,
  > colgroup + thead,
  > thead:first-child {
    > tr:first-child {
      > th,
      > td {
        border-top: 0;
      }
    }
  }
  > tbody + tbody {
    border-top: 2px solid @table-border-color;
  }

  .table {
    background-color: @body-bg;
  }
}

到

.table {
  width: 100%;
  max-width: 100%;
  margin-bottom: @line-height-computed;
  > thead,
  > tbody,
  > tfoot {
    > tr {
      > th,
      > td {
        padding: @table-cell-padding;
        line-height: @line-height-base;
        border-top: 1px solid @table-border-color;
      }
    }
  }
  > thead > tr > th {
    border-bottom: 2px solid @table-border-color;
  }
  > caption + thead,
  > colgroup + thead,
  > thead:first-child {
    > tr:first-child {
      > th,
      > td {
        border-top: 0;
      }
    }
  }
  > tbody + tbody {
    border-top: 2px solid @table-border-color;
  }

  .table {
    background-color: @body-bg;
  }
}