Max-height reached and the div continuesly goes to right like responsive overflow-x
http://stackoverflow.com/questions/37314188/max-height-reached-and-the-div-continuesly-goes-to-right-like-responsive-overflo
by fido3993
HTML
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
<div class="populalist">
<div class="broad-structure">
<div class="broad-content">
<div class="structure">
<img src="" alt="photo" class="img-responsive veno">
<div class="desc-pro">
<label>Nirvana</label>
<p>Fulltime Daytrader</p>
<p>Germany</p>
</div>
<div class="clear"></div>
</div>
</div>
<div class="broad-content">
<div class="structure">
<img src="" alt="photo" class="img-responsive veno">
<div class="desc-pro">
<label>Nirvana</label>
<p>Fulltime Daytrader</p>
<p>Germany</p>
</div>
<div class="clear"></div>
</div>
</div>
<div class="broad-content">
<div class="structure">
<img src="" alt="photo" class="img-responsive veno">
<div class="desc-pro">
<label>Nirvana</label>
<p>Fulltime Daytrader</p>
<p>Germany</p>
</div>
<div class="clear"></div>
</div>
</div>
<div class="broad-content">
...
CSS
.broad-structure {
display: flex;
flex-direction: column;
flex-wrap: wrap;
height: 600px;
border: 1px solid red;
}
.broad-content{
height: 150px;
}
.structure .veno{
float: left;
margin-right:20px;
width: 80px;
height: 80px;
border-radius: 50%;
}
.desc-pro{
padding: 15px 0;
}
.story{
white-space: normal;
text-align: justify;
}
.nodes{
background-color: rgba(221, 213, 213, 0.11);
height: 100%;
}
.grayz{
background-color: rgba(221, 213, 213, 0.11);
}
.fishy{
background-color: rgba(221, 213, 213, 0.11);
height: 100%;
}
.chandelier{
padding: 30px;
}
.tagline img{
width: 100%;
height: 350px;
}
.cont-struct{
height: 850px;
overflow: hidden;
}
.viso{
display: inline-block;
width: 420px;
border-left: 1px solid #eee;
white-space: normal;
border: 1px solid #eee;
}
.construct{
padding: 30px;
}
.construct h3{
color: rgba(104, 109, 132, 0.58);
font-weight: 700;
margin-top: 20px;
}
.btn-nero {
width: 88%;
}
.setia{
width: 100%;
height: 200px;
cursor: pointer;
}