If you thought responsive design was reserved for CSS layouts only, you’ll be pleased to hear media queries can also be used in JavaScript. Continue reading %How to use Media Queries in JavaScript% ...
Messing around with experimental code is easy thanks to several free online development playgrounds. Craig Buckler looks at seven of the best… Continue reading %7 of the Best Code Playgrounds% ...
My aim in this article is to give you a thorough introduction to GreenSock, also known as GSAP (GreenSock Animation Platform), a super performant, professional-grade HTML5 animation engine for the modern web. This is the fourth article in the series Beyond CSS: Dynamic DOM Animation Libraries. Here’s what I cove...
In this post we want to share with you a collection of 20 useful conventions and best practices that are recommend by the CSS community. Some are tailored more towards beginners, and some are a bit advanced, but we hope everyone will find a cool trick they didn’t know about. Enjoy!1. Beware of Margin Collapse...
Flexbox is a CSS standard optimized for designing user interfaces. Using the various flexbox properties we can construct our page out of small building blocks, which then are effortlessly positioned and resized any way we want. Websites and apps made this way are responsive and adapt well to all screen sizes. I...
Cordova is a phenomenal tool that allows you to build native mobile apps using the web technologies you know and love. It gives access to some hardware features unaccessible in vanilla HTML5, and most crucially, the marketing potential of app stores. Cordova allows you to write your application code once in HTML5 and J...
In this post we are going to talk about two CSS properties that not a lot of web developers know about. They are called object-fit and object-position and both have to do with styling images and video. First, we’ll show you how to use them and go into detail covering all the important specs. After that, we...
While developing web layouts, at some point you’ve probably run into this issue:This obviously broken layout happens when a footer is positioned statically at the end of the body, but the page doesn’t have much content. There is nothing to push the footer down enough and it stays in the middle of scree...
When web projects grow bigger, their CSS usually becomes astronomically large and often times messy. To help us deal with this, new CSS variables are soon to hit mainstream browsers, giving devs the ability to reuse and easily edit repeatedly occurring CSS properties. We’ve shown you how awesome stylesheet var...
Making pretty, responsive, headers is always a tricky process. Until now you needed to use floats or other complicated tricks and you even had to manually adjust pixel values. But not any more! The technique we are about to show you relies on the powerful flexbox layout mode to do all the dirty work for you. It us...
Recent Comments