CSS3 SLIDING ANIMATIONS

Most of the image gallery display nice little image with a cute description underneath it. If you want to make yours a little better, here’s a quick tutorial on how to improve the the user experience of your image gallery. The concept is easy, each images are displayed but not the text. The text will…

13 Best CSS Hack

1. Target IE6, IE7, and IE8 with only 4 characters (hack) See the source above for a quick explanation. And don’t ask me to explain why 9 works for IE8…but it does. Use these with caution. [css] body { color: red; /* all browsers, of course */ color : green9; /* IE8 and below */ *color…

Resize image and rounded corners using CSS

The idea is to use the background-size: cover; CSS property which handles the centering, cropping and, well, covering. Here’s an extract from the fiddle: div.yourWrapper { width: 50px; height: 50px; -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; background: url(‘some_image.jpg’) no-repeat center center; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; }