Constructs

Chris Coyier showed us the mechanics behind Lucas Bebber’s stunning CSS effect called Glitch. Chris created three copies of the desired area via pseudo elements and these copies are positioned right on top of each other and they can be controlled individually. View more to see his complete guide to create the CSS glitch effect. Also check out Chris’s own version of the effect at the end of the article.

See how it’s done

There are many ways to center things in CSS and it depends on the situations and creativity of the front-end developer, which can sometimes be quite confusing. Thanks to Chris Coyier, he has created a complete guide for centering things in CSS. Also covered in the article is how to CSS center things in different situations for vertical and horizontal modes respectively, and also for both modes at the same time. Very useful.

View More

Filter.css is used to apply image filters, patterns and colour blending, especially useful for making full image background appear better. To apply the CSS image filter effects, you’ll simply need to add class name. For example, class="grid" applies a grid filter to the desired area in an HTML file. David Furlong has prepared five examples in the demo page showing blurred and overlay filters among all. You can also combine several filter classes for more design control. Visit the link for a list of applicable class names and demo.

About FILTER.CSS   See the filters in action

If you have been designing for the Web at all over the past decade you are undoubtedly familiar with the CSS float property. Since the industry adopted the principle of tableless layouts, floats have been the weapon of choice most of us use to lay out our web pages, but is it the best choice?  In his article, David Conner will share the alternatives of using CSS float.

View More