Skip to content

Instantly share code, notes, and snippets.

@faruk09

faruk09/Center Images of Different Sizes in the Middle of a div

Created January 16, 2020 16:59
Show Gist options
  • Save faruk09/4e560cef0774563b82819cd6a4bba4ff to your computer and use it in GitHub Desktop.
Save faruk09/4e560cef0774563b82819cd6a4bba4ff to your computer and use it in GitHub Desktop.
Download ZIP
Center Images of Different Sizes in the Middle of a div
Raw
Center Images of Different Sizes in the Middle of a div
<div class="row centered" >
<div class="col-xs-12 col-sm-4 col-md-2" style="">
<a href="http://example.com/" target="_blank"><img src="cover.png"></a>
</div>
<div class="col-xs-12 col-sm-4 col-md-2" style="">
<a href="http://example.com" target="_blank"><img src=""></a>
</div>
</div>
...........
css
................
.row.centered {
height: 100vh;
display: flex;
align-items: center;
justify-content: center;
}
https://css-tricks.com/snippets/css/absolute-center-vertical-horizontal-an-image/
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment