Есть два блока div
. Поставлены в одну строку. В первом диве есть изображение, которое может меняться, соответственно меняя высоту своего блока. Нужно, чтобы правый блок был равен высоте левого, при любом изображении. То что было найдено в интернете, не помогло. Так же интересует как сделать блоки .tags
и .name
той же ширины, что и блок с картинкой. И как прикрепить #comm
к нижней границу правого блока?
.main{
margin-bottom: 60px;
}
.container {
border: 1px solid black;
max-width: 1050px !important;
height: auto;
}
.container .div {
float: left;
background: #fff;
}
#left img {
width: 700px;
max-width: 800px !important;
height: auto;
}
#right{
width: 300px ;
height: 500px;
padding-left: 50px;
}
.tags, .name{
border: 1px solid black;
width: auto;
max-width: 1050px;
height: 40px;
}
#comm {
vertical-align: bottom;
border: 1px solid black;
height: 30px;}
<div class="main">
<div class="name">222</div>
<div class="container">
<div class="div" id="left"><img src="http://ivlowen.pw/JPLv.jpg"></div>
<div class="div" id="right">
<div></div>
<div id="comm"></div>
</div>
<div style="clear:both;"></div>
</div>
<div class="tags"></div>
</div>