Author
Guil is the front-end design teacher at Treehouse. You can follow Guil on Twitter at @guilh.
December 2, 2014 in Learn
HTML5’s local storage feature allows the browser to store and retrieve specific data. In this post, we’ll pick up where we left off in the previous post where we built a real-time CSS editor using the HTML5 contenteditable attribute. Now we’re…
October 13, 2014 in Learn
The last wave of new CSS3 features introduced in-browser design features like border-radius, gradients, multiple backgrounds, and box-shadow. CSS continues to evolve and today’s native features are becoming closer to tools we’d normally use in our favorite graphics editor. In…
September 4, 2014 in Learn
With Sass mixins we’re able to pass a list of arguments to set the values of properties. For example, the following mixin uses four variables as arguments to define the display, padding and margin properties of an element. @mixin display ($disp, $padding, $l-margin, $r-margin)…
July 31, 2014 in Learn
When generating pseudo-elements with CSS, we usually need to define certain properties to display the elements. This often means repeating CSS declarations for content, display and position, the most common properties used for generating shapes with pseudo-elements. With Sass, we’re able to…
April 10, 2014 in Learn
In order to achieve smooth transitions and animations, a browser needs to avoid doing extra work on its main thread, the part that’s in charge of handling tasks like JavaScript, style calculations, layout, painting and compositing (more on these later)….
April 3, 2014 in Learn
There’s more to writing good front-end code than knowing every HTML tag, CSS selector, or the latest front-end features and techniques. And as I mentioned in a recent blog post, writing good code takes a lot of patience and practice….
December 6, 2013 in Community
Hampton Catlin is widely known for being the creator of Sass and Haml. He’s also the author of “The Pragmatic Guide to Sass,” built the mobile version of Wikipedia, Dictionary! for iPhone, and founded the libsass project. I recently interviewed Hampton…
October 24, 2013 in Learn
Developing for high-resolution displays often requires different image resources for each image. Because of this, there’s been a need for a more standard way of serving responsive content images – ones that adapt to different resolutions and viewport sizes. What…
July 18, 2013 in Learn
The CSS clearfix has been a must-have in our web design toolkit for quite some time and, until new layout features like flexbox become more stable, we’ll always need some form of clearfix in float based layouts. There are several…
July 8, 2013 in Learn
We’ve all used border-radius in our designs to round the corners of images, divs, navs, etc. But have you ever noticed what happens when a thick border is added to an element with a border radius? As we learned in…
July 3, 2013 in Learn
Combinators describe the relationship between CSS selectors, and they’re commonly used to combine two or more selectors into a more specific selector. Examples of combinators are the greater-than sign (>), plus sign (+), and tilde symbol (~). If you’ve ever worked with descendant selectors,…
April 15, 2013 in Learn
I recently wrote an article on creating a themable button set with Sass where I used a mixin to define all base styles, then a color value was passed as an argument when included in each theme. Example: @mixin btn-theme($btn-color)…