html - Align images of different size in different div of the same row -
<div class="row org-logo m-b-lg"> <div class="col-sm-3 col-xs-6 text-center"> <a href="http://www.psychologicalscience.org/" target="_blank"><img src="/static/img/meeting-page/aps.jpg" alt="logo american physiological society (aps)" class="img-responsive"></a> </div> <div class="col-sm-3 col-xs-6 text-center"> <a href="http://www.bitss.org/" target="_blank"><img src="/static/img/meeting-page/bitss.png" alt="logo berkeley initiative transparency in social sciences (bitss)" class="img-responsive"></a> </div> <div class="col-sm-3 col-xs-6 text-center"> <a href="http://www.nrao.edu/" target="_blank"><img src="/static/img/meeting-page/nrao.jpg" alt="logo national radio astronomy observatory (nrao)" class="img-responsive"></a> </div> <div class="col-sm-3 col-xs-6 text-center"> <a href="http://www.spsp.org/" target="_blank"><img src="/static/img/meeting-page/spsp.jpg" alt="logo society personality , social psychology (spsp)" class="img-responsive"></a> </div> </div> above screenshot of row of logos of different organizations. obvious logo of aps not aligned other logo. do if want align these logo images, each of different sizes, according center of image?
just give css , see if looks okay?
.img-responsive { min-height: 85px; max-height: 85px; vertical-align: top; } just note, not give both width , height.

Comments
Post a Comment