Posted By

gabrielsmith on 02/08/11


Tagged


Versions (?)

Who likes this?

2 people have marked this snippet as a favorite

sjacunningham
abbyabigale


Vertically and Horizontally Centered Images in CSS


 / Published in: HTML
 

  1. .logo {
  2. display: block;
  3. text-align: center;
  4. display: block;
  5. text-align: center;
  6. vertical-align: middle;
  7. border: 4px solid #dddddd;
  8. padding: 4px;
  9. height: 74px;
  10. width: 74px; }
  11. .logo * {
  12. display: inline-block;
  13. height: 100%;
  14. vertical-align: middle; }
  15. .logo .photo {
  16. height: auto;
  17. width: auto;
  18. max-width: 100%;
  19. max-height: 100%;
  20. }
  21. <figure class='logo'>
  22. <span></span>
  23. <img class='photo'/>
  24. </figure

Report this snippet  

You need to login to post a comment.