Images Larger than Container

This will center the image inside of a element when the elements height and/or width is smaller than the image. This works well when you have image assets of various aspect ratios that you want to display as thumbs that are the same size.

ul#images-edit li {
    float: left;
    height: 100px;
    margin: 0 8px 8px 0;
    overflow: hidden;
    position: relative;
    width: 100px;
ul#images-edit li img {
    position: absolute;
    top: -9999px;
    bottom: -9999px;
    left: -9999px;
    right: -9999px;
    margin: auto;
    width: 150px;
comments powered by Disqus