CSS3 linear gradients
By Chris Mills Introduction For as long as we can remember, we have used colour gradients on the Web to brighten things up, and add class to designs. If you want to create a fantastic looking button, panel, gauge, progress bar or other UI feature, a gradient is the way to go.
Perfectly Rotate and Mask Thumbnails With CSS3
Ever seen a website showcasing image thumbnails that are slightly rotated? It's a simple effect that adds a layer of visual personality. Saying that, if you're not achieving the rotation effect with CSS, you're working too hard! Learn how to do it right! Republished Tutorial Every few weeks, we revisit some of our reader's favorite posts from throughout the history of the site.
Using Sass’s @error, @warn, and @debug Directives
Feedback methods are essential in any programming language. In JavaScript, you’ve probably used console.log() or maybe alert(). In PHP, you can use var_dump() or print_r(). In Ruby, you may use debug or inspect.
Infographics Showcase - Infographic Reviews - Submit Infographic - Part 2
Filed under: Business Infographics, Legal Infographics, People Infographics | Comments Off The Special Risks Bureau has compiled a list of the most expensive body parts celebrities have insured, and used them to create the most valuable celebrity couple in the world. Body parts include Gene Simmons’ tongue, Rod Stewart’s voice, Cristiano Ronaldo’s legs, Julia Roberts smile, Jennifer Lopez’s bum, and Mariah Carey’s legs.
Circle Hover Effects with CSS Transitions
« Previous Demo: Animated Responsive Image Grid Back to the Codrops Article Use what you have by Angela Duncan View on Dribbble Common Causes of Stains by Antonio F. Mondragon View on Dribbble Pink Lightning by Charlie Wagers View on Dribbble
A new micro clearfix hack
The clearfix hack is a popular way to contain floats without resorting to using presentational markup. This article presents an update to the clearfix method that further reduces the amount of CSS required. Demo: Micro clearfix hack Known support: Firefox 3.5+, Safari 4+, Chrome, Opera 9+, IE 6+
Create Pure CSS3 Ticket-Like Tags
Tags are a familiar feature of many Web 2.0 services, websites and especially blogs. During this tutorial we're going to use CSS3 to create ticket-like tags, without relying on any images. Here's a quick breakdown of the process: Create the HTML markup.Style the main tags.Style the four corners of the tag.Style the link.Add and style a punched hole in the tag. Step 1: HTML Header Markup
Stripes in CSS
By Chris Coyier On Stripes are pretty easy to do in CSS these days. CSS gradients via the background-image property really got our back. I thought I'd document some variations in one easy to reference place.
