html - How to prevent div inside of a row from increasing it's size? (screenshots) -
the problem if title long, goes second line , makes whole post div bigger. there way prevent behaviour?
i use text-overflow:ellipsis there's better solution.
thanks
up
<div class="row"> <div class="news-list"> <article class="col-sm-6"> <div class="image-holder"> <img src=""> </div> <h4><a href=""></a></h4> <time datetime=""></time> | <a href="#"> </a> <p>excerpt</p> </article> </div>
so i'm filling row divs
.news-list article { overflow: hidden; margin-bottom: 74px; } .col-sm-6 { width: 50%; float: left; }
screens:
before screen resizing
after
in case have clear every 3rd div. use code snippet achieve want.
.news-list article:nth-child(2n+1) { clear: both; }
this clears every third float, should fix problem.
Comments
Post a Comment