CSS

2017-07-03T00:00:00.000Z 3rd July 2017

SCSS Reverse direction

There may be a point in your CSS coding that you want to know the opposite of a direction (e.g. up, down). This function allows you to pass it a direction and get the opposite back!

2017-05-03T00:00:00.000Z 3rd May 2017

Multiple transition delays

Being able to animate with CSS transitions is great, although there are a few gotchas when using them. This one with transition-delay had me scratching my head for a while.

2017-04-26T00:00:00.000Z 26th April 2017

CSS Custom Properties - everyday applications

CSS Custom properties are now supported in Edge, meaning you can use them nearly everywhere. However, there are some cases where further browser support is required. Using PostCSS we can use CSS custom properties in development while still maintaining cross browser support.

2016-11-17T00:00:00.000Z 17th November 2016

Find and remove vendor prefixes in your CSS using Regex

I recently set out to remove all of the vendor prefixes from the CSS for all of our clients at work. This is because we use Gulp with Autoprefixer - which means we have up-to-date prefixes and cleaner SCSS. One way of doing this would be to open every CSS file, search for `-moz`, then search for `-webkit` etc. Some of the CSS I was searching through is well over 5 years old and is rife with vendor prefixes.

2016-05-20T00:00:00.000Z 20th May 2016

CSS frameworks and why you should make one

With recent front-end twitter conversation turning to CSS frameworks, I went on a roller coaster of emotions but eventually settled on the above to sum up how I felt about the ordeal. Before we settle once more, let me take you on the journey I travelled.

2015-11-02T00:00:00.000Z 2nd November 2015

Responsive Typography in SCSS

Liquid Light

Making sure your typography is readable on every display is arguably one of the most important aspects of front-end development. If your users can’t read the content on the ...

2014-11-11T00:00:00.000Z 11th November 2014

Creating SVG Sprites using Gulp and Sass

Liquid Light

Following on from our recent blog post about SVG Sprites which gave an introduction and overview to using SVGs in a sprite, this post will outline the processes and tools ...

2014-08-07T00:00:00.000Z 7th August 2014

Working with SVGs in Sprites

Liquid Light

This article will explain how and why you would want to use SVGs and what advantages using them in a sprite can bring. It will also cover scaling the images ...

2014-06-10T00:00:00.000Z 10th June 2014

Remaking the Sass News Newsletter

With the weekly golden nectar of Sass News winging its way into my inbox every week, I decided to take on the challenge of giving the newsletter a facelift

2014-03-24T00:00:00.000Z 24th March 2014

An Introduction to CSS Preprocessors

Writing and updating CSS can be a repetitive, tedious and arduous task - especially for big projects. CSS preprocessors can help with that - amalgamating related styles and helping you make your style sheets more DRY

2014-03-17T00:00:00.000Z 17th March 2014

A basic SCSS compilation gulpfile.js

This post introduces how to compile SCSS with Gulp along with some core concepts

2014-02-23T00:00:00.000Z 23rd February 2014

Sass Rule Layout

We've been going through a bit of a reshuffle at work with regards to our front-end conventions and layout.

2014-02-04T00:00:00.000Z 4th February 2014

From Less to Sass

Recently we've decided a change in preprocessor to help optimise our workflow. Within this blog post, I am going to type Sass, but really I mean Scss.

2013-10-23T00:00:00.000Z 23rd October 2013

A placeholder mixin - for Less and Scss

Creating a Less mixin to style input placeholders without using an autoprefixer

2013-10-19T00:00:00.000Z 19th October 2013

Compiling Less on the Command Line

We have been using LESS for a while now, but our process involved including the less.js in the header during development, compiling the LESS using an app before launch and then maintaining the site using the css.

2012-11-11T00:00:00.000Z 11th November 2012

Sass - Hidden Gems

I've recently been getting into pre-processors for CSS and I have been using LESS for sometime - getting to grips with the nesting and variables while keeping a library of my own mixins.

2012-01-24T00:00:00.000Z 24th January 2012

It's My Way or the Highway. Not.

Recently with the spate of CSS3 and media queries, there has been a few debates over how development should be done.

2009-01-25T00:00:00.000Z 25th January 2009

CSS - The basics

CSS, or Cascading Style Sheets are the easiest, cleanest and most accessible way of styling a website. Tables were previously used to position objects on the page and CSS used just to make the text look pretty. Now CSS is being relied more and more to position images, text, add spacing to websites and bring the whole site together.