De Wiki @ Brest
Ligne 7 : | Ligne 7 : | ||
} | } | ||
.img-crop{ | .img-crop{ | ||
− | + | border-color: 1px dotted #ededed; /* some background color for short images */ | |
overflow: hidden; | overflow: hidden; | ||
width:160px; | width:160px; | ||
height:120px; | height:120px; | ||
− | margin:4px | + | margin:4px; |
− | padding:0 | + | padding:0; |
float:left; | float:left; | ||
/* remove white-space for inline-block elements */ | /* remove white-space for inline-block elements */ | ||
Ligne 24 : | Ligne 24 : | ||
display: inline-block; | display: inline-block; | ||
vertical-align: middle; | vertical-align: middle; | ||
+ | horizontal-align: middle; | ||
} | } | ||
.img-crop:before{ | .img-crop:before{ |
Version du 11 juillet 2013 à 13:42
{{#css:
.img-crop,
.img-crop img{
width: 150px; /* gotta be responsive these days */
}
.img-crop{
border-color: 1px dotted #ededed; /* some background color for short images */
overflow: hidden;
width:160px;
height:120px;
margin:4px;
padding:0;
float:left;
/* remove white-space for inline-block elements */
letter-spacing: -0.31em; /* webkit */
*letter-spacing: normal; /* reset IE < 8 */
word-spacing: -0.43em; /* IE < 8 && gecko */
}
.img-crop:before,
.img-crop img{
/* vertically center the image */
display: inline-block;
vertical-align: middle;
horizontal-align: middle;
}
.img-crop:before{
/* pseudo element to vertically align image to */
content: "";
/* Magic Number */ /* Set this to your desired height(to width) ratio */ padding-top: 75%; /* % of original image width */ } .img-crop img{ /* removes(sorta) image from the flow */ padding-left: 100%; margin: -999em -100%; } }}
| ||||
|
[edit] Description: Arguments:
Usage: |