我有三个元素,我试图在我的布局中对齐.
首先,我有一个div反馈,然后是搜索输入,然后是div元素的建议.
我希望第一个和最后一个元素的宽度为20%,搜索输入的宽度为60%.使用Flexbox我实现了我想要的.
但是有一个功能可以将所有div增加到最高元素.这意味着当弹出搜索结果时,反馈和建议元素的高度会随着搜索div的增加而产生混乱的布局.
有没有一个技巧不增长具有最高元素的div?只是使div(#feedback和#suggestions)具有内容的高度?
#container_add_movies {
display: flex;
}
#container_add_movies #feedback {
width: 20%;
background-color: green;
}
#container_add_movies #search {
width: 60%;
background-color: red;
}
#container_add_movies #suggestions {
width: 20%;
background-color: yellow;
}Run Code Online (Sandbox Code Playgroud)
<div id='container_add_movies'>
<div id='feedback'>
Feedback
</div>
<div id='search'>
Search
<br>Search
<br>Search
<br>Search
<br>Search
<br>Search
<br>Search
<br>Search
<br>Search
<br>Search
<br>
</div>
<div id='suggestions'>
Suggestions
</div>
</div>Run Code Online (Sandbox Code Playgroud)