根据其邻居种植div高度

我想让div根据其邻居高度生长其高度。问题是我必须能够给他们一个最低高度。（130px）。我认为这是一个非常基本的问题，但我不明白，希望有人能帮助我。根据其邻居种植div高度

问题：

div.guide图像和div.guide-DESCR应该总是具有相同的高度
div.guide（或其儿童的）应具有的130px的最小高度。

以下情况： jsFiddle

HTML

<div class="guide"> 
    <div class="guide-image"><img src="http://lorempixel.com/64/36" /></div> 
    <div class="guide-descr">Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. </div> 
</div>

CSS

* 
{ 
    margin: 0; 
    padding: 0; 
} 

div.guide 
{ 
    width: 800px; 
} 

div.guide-image 
{ 
    float: left; 
    width: 250px; 

    background-color: #B0BAC9; 
} 

div.guide-image img 
{ 
    display: block; 
    margin: 40px auto; 

    max-width: 90%; 
    max-height: 80%; 
} 

div.guide-descr 
{ 
    float: left; 
    width: 550px; 

    padding: 25px 25px 25px 25px; 
    box-sizing: border-box; 

    background-color: #116FD1; 
}

来源

2014-10-27 Joachim Havloujian

使用display属性代替float可以导致您的目标。试试这个：

div.guide 
{ 
    display:table; 
    width: 800px; 
} 

div.guide-image 
{ 
    display:table-cell; 
    vertical-align:middle; 
} 
div.guide-descr 
{ 
    display:table-cell; 
    vertical-align:middle; 
}

检查DemoFiddle

Antoher方式，可以使用flexbox方法，但仄如果你能支持Here

div.guide 
{ 
    display:flex; 
    width: 800px; 
}

演示了Flex的DemoFiddle

来源

2014-10-27 13:38:57 DaniP

你每天都可以学习提炼新的，甚至不知道有可能给一个div的表格布局。谢谢@Danko – 2014-10-27 13:49:03

@JojoHav很乐意帮助你。 – DaniP 2014-10-27 13:51:37

根据其邻居种植div高度

回答

相关问题