使用CSS强制DIV覆盖整行

Question

我正在使用一个生成3个div标签的框架。这三个div标签覆盖页面上的一行。 看起来第一个div覆盖了行的25％，2个div覆盖了行的25％，第三个div覆盖了行的50％。我可以访问第三个div正在使用的css类，如下所示：

.dataTables_processing {
  position: fixed;
  top: 50%;
  left: 50%;
  min-width: 125px;
  margin-left: 0;
  padding: 7px;
  text-align: center;
  color: #333;
  font-size: 13px;
  border: 1px solid #ddd;
  background-color: #eee;
  vertical-align: middle;
  -webkit-box-shadow: 0 1px 8px rgba(0, 0, 0, 0.1);
  -moz-box-shadow: 0 1px 8px rgba(0, 0, 0, 0.1);
  box-shadow: 0 1px 8px rgba(0, 0, 0, 0.1);
}

有没有办法修改此类以使其覆盖整行？

Answer 1

试试这个

display: block;
width: 100%;
min-width: 100% !important;

Answer 2

尝试添加：

position:absolute;
left:0;
width:100%;

Answer 3

如果您尝试将每个div都排成一行并希望它们垂直对齐，请使用bootstrap并执行以下操作：

<div style='display: flex; flex-direction: column;'>
  <div class='row'> my content to take a row </div>
  <div class='row'> my content to take second row </div>
  <div class='row'> my content to take a third</div>
</div>

希望有帮助。