Introducing the Flexible Box Layout Module

One aspect of CSS3 that hasn’t received a lot of attention so far is the Flexible Box Layout module. Already implemented in the Gecko and WebKit engines, in this alternative box model the children of a box are laid out either horizontally or vertically, and unused space can be assigned to a particular child or distributed among the children by assignment of ‘flex’ to the children that should expand. Here’s how this works…

VN:F [1.9.22_1171]
Rating: 0 (from 0 votes)

Manipulating CSS Classes With jQuery

In this lesson I want to illustrate you how to use some useful jQuery methods that allow you to manipulate easily CSS classes. In particular I prepared some examples to explain the following methods: toggleClass, hasClass, addClass and removeClass…

VN:F [1.9.22_1171]
Rating: 0 (from 0 votes)

Quickie CSS3 Tricks with Fallbacks

CSS3 can do some seriously neat stuff. Just check out some of the crazy 3D stuff you can do in WebKit. But as we all know, we need to be careful with what we choose to do with it. The most cutting edge techniques are fun to play with, but since since only a sliver of browsers support them fully, we can only use them in circumstances where they fall back to otherwise perfectly acceptable styling. Let’s look at a couple of quick, simple examples…

VN:F [1.9.22_1171]
Rating: 0 (from 0 votes)

Guidelines for Developing Your Own CSS Framework

Quite a few CSS frameworks have been around for a while, but most web developers avoid using them. Instead most veteran developers prefer to create their own CSS framework, which provide benefits of a personalized solution and minimizes negative aspects of depending on a third party solution…

VN:F [1.9.22_1171]
Rating: 0 (from 0 votes)

Mobile Optimised Websites Using CSS3 Media Queries

CSS3 Media Queries can be used in conjunction with CSS 2.1 Media Types to target mobile users with a set device size or screen dimension. Using these queries, you can provide optimised CSS style sheets that are tailored to a particular size of device…

VN:F [1.9.22_1171]
Rating: +1 (from 1 vote)

SpriteMe – Tool to Generate CSS Sprites

Background images make pages look good, but also make them slower. Each background image is an extra HTTP request. There’s a fix: combine background images into a CSS sprite. But creating sprites is hard, requiring arcane knowledge and lots of trial and error. SpriteMe removes the hassles with the click of a button…

VN:F [1.9.22_1171]
Rating: 0 (from 0 votes)