<分区>
<分区>
使用 Bootstrap 3。 我有两个具有相同高度的列(col-md-8 和 col-md-4)。 (多亏了这里找到的一个小片段 :) )
这没关系,它有效。 但我需要它们具有背景色。问题是 - 事实上这是正常的 - 两个 col 并排在一起,所以它们之间没有白色的排水沟。
我可以尝试在每个列中使用“内部”div。但是我需要这些内部 div 具有与父级相同的高度。
她的结果: You can see the gutters filled with the background color
@media only screen and (min-width : 768px) {
.is-table-row {
display: table;
}
.is-table-row [class*="col-"] {
float: none;
display: table-cell;
vertical-align: top;
}
}
.red {
background: red;
}
.green {
background: green;
}
<div class="container">
<div class="row is-table-row">
<div class="col-md-8 red"> text </div>
<div class="col-md-4 green"> text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text </div>
</div>
</div>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous">
你能帮帮我吗?
最佳答案
这就是我解决此类问题的主要方式:
<div class="row is-table-row">
<div class="col-md-8 red">
<div class="inner">
text
</div>
</div>
<div class="col-md-4 green">
<div class="inner">
text
</div>
</div>
</div>
CSS 是:
.red .inner{
background: red;
}
.green .inner{
background: #343335;
}
.red, .green{
padding: 10px;
}
我不知道这是否是最好的解决方案,但它可以完成工作
关于html - Bootstrap 具有相同高度和背景颜色的列,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/38029959/