Skip to main content
CSS is fun and cool and I like it.
Article

Gulp for Beginners

Gulp is a tool that helps you out with several tasks when it comes to web development. It's often used to do front end tasks like:

  • Spinning up a web server
  • Reloading the browser automatically whenever a file is saved
  • Using preprocessors like Sass or LESS
  • Optimizing assets like CSS, JavaScript, and images

Important Note! This article was written for Gulp 3.x, but now Gulp 4.x is out and recommended. Like any major version change, APIs have breaking changes. If … Read article

Article

Cross Browser CSS Injection

The ability to inject newly-modified CSS on every file change (without reloading the page) is the type of workflow-enhancement that you never truly appreciate... until you lose it.

This is exactly what happened to me recently.

For at least the last 12 months I had been using Grunt and the LiveReload browser extension to inject CSS when my files changed. It felt like a really nice workflow until I had to work on a project that required IE7 & 8 … Read article

#010 – CodeKit For Great Success

In this screencast we have CodeKit start watching our project. This makes lots of developer tasks much easier.

The first thing we do is us it to losslessly optimize an image. Easy one click.

Then we install Compass in the project. This gives us the ability to use CSS3 mixins provided by Compass, instead of having to create our own, which we should surely do a worse job.

Perhaps most importantly, Compass (through CodeKit) now watches our project folder and … Read article

Snippet

Inject New CSS Rules

If you need to change the style of an element with JavaScript, it's typically better to change a class name and have the CSS already on the page take effect and change the style. However, there are exceptions to every rule. For instance, you might want to programmatically change the pseudo-class (e.g. :hover). You can't do that through JavaScript for the same reason inline style="" attributes can't change pseudo classes.… Read article

icon-link icon-logo-star icon-search icon-star