Navigation

CSS articles

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 (thankfully) adopted the principle of tableless layouts, floats have been the weapon of choice...
One of the most invaluable features of Photoshop—arguably, the feature that powered it ahead of its competition—is blend modes. Blend modes take two pixels laid on top of each other and combine them in different ways, for example the darker...
We might be inclined to think of highly decorative and multi-colored fonts as belonging to the digital type age. Not so. Chromatic Type which enabled the use of outlines, shadows, and multiple colors (among other things) go back to the mid-19th...
Trends come and trends go. The ones that stick around the longest do so because they solve a particular problem. A trend that's popular right now for that very reason, is sticky elements; elements that behave normally until we scroll, and...
CSS3 has introduced countless possibilities for UX designers, and the best thing about them is that the coolest parts are really simple to implement. Just a couple of lines of code will give you an awesome transition effect that will excite...
Beautiful visual design isn't enough any more, modern design needs great interaction to really stand out. Animations in your designs can provide clarity, direct attention, and create a delightful experience. Designing interactions is...
A lot of designers use some sort of CSS pre-processor, whether that be Sass, LESS or Stylus. If you've used any of these, you're probably also aware that Compass is a framework built on Sass, and although its installation may be off-putting,...
You may have heard of CSS preprocessing and be wondering what all the buzz is about. You may even have heard of Sass or LESS. In short, preprocessing your CSS allows you to write more concise stylesheets which are formatted nicely and require...
Take a look at this incredible Pen, it's an homage to how radically the Apple mouse has evolved over the years. Using a clever blend of CSS drawing and transitions, Josh Bader illustrates the beautiful simplicity of a device that — without...
Do you revel in experimenting with leading-edge web design but feel conflicted by the formal technical specifications set forth by the W3C? Have doubts about applying your avant-garde ideas while achieving cross browser support and meeting...
/ / Oct 24, 2013
Building complex, flexible layouts has never been easy, but CSS3 has certainly taken away a lot of the headaches. CSS3 features like Flexbox and Columns have made some complex layouts a real possibility and now they're being joined by one of...
One of the key concepts in any responsive design is the change of viewport size. That's because mobile viewports vary greatly from desktop viewports. To control the viewport size we traditionally use the viewport meta tag. However, the viewport...
If the recent flat design trend has demonstrated anything, it's how incredibly limited web designers are when it comes to composition. Now that we're no longer distracted by bevels, gradients and gloss it's clear that web designers have one...
Responsive design is everywhere, and whether you're using a framework or writing media queries yourself, some elements on your page are bound to move or scale. If your media queries are based on browser dimensions and the browser is resized,...