动态增加 div 的高度正在为同级 div 创造空间答案

【问题标题】：Dynamically increasing height of div is creating space for sibling div动态增加 div 的高度正在为同级 div 创造空间
【发布时间】：2019-08-10 15:37:59
【问题描述】：

我必须增加div 的高度，当它的高度增加时，它的兄弟div 下方会出现空间，这不应该发生，它应该保持修复。

<div class = "col-md-12">
    <div class = "col-md-6 sibling1"></div>
    <div class = "col-md-6 sibling2"></div>
</div>
<div class = "col-md-12">
    <div class = "col-md-6"></div>
    <div class = "col-md-6"></div>
</div>

如果我增加“sibling2”的高度，应该不会对页面产生任何影响。

在上图中，我尝试增加div(黑色背景) 的高度，因此div(aliceblue 背景) 有相应的空间。

如何解决。

【问题讨论】：

您能否粘贴您的代码作为示例，以便我们更好地帮助您？
以上 HTML sn-p 可以参考。

标签： html css twitter-bootstrap-3

【解决方案1】：

    <!DOCTYPE html>
<html>
<head>
    <title></title>
</head>
<style type="text/css">
    .contain1{
        width: 100%;
        height: auto;
        display: flex;
    }
    .box1{
        width: 50%;
        background-color: #f0f8ff;
        height: 100px;
    }
    .box2{
        width: 50%;
        background-color: black;
        height: 150px;
    }
    .contain2{
        background-color: #EAE7E6;
        height: 200px;
    }
</style>
<body>
    <div class="contain1">
        <div class="box1">

        </div>
        <div class="box2">

        </div>
    </div>
    <div class="contain2">

    </div>
</body>
</html>

现在尝试增加 .box2 的高度，看看效果。

【讨论】：

问题仍然存在