Skip to content

Dear Internet Explorer user: Your browser is no longer supported

Please switch to a modern browser such as Microsoft Edge, Mozilla Firefox or Google Chrome to view this website's content.

CSS logo

Multi-line gradient hyperlinks

Posted 18th February 2021

No comments

Use cascading style sheets to create a gradient underline link that will span multiple lines.

Read the full story...

CSS3 logo

Styling the colour of <pre><code> horizonal scrollbars

Posted 4th December 2020

No comments

Despite the absence of a proper scrollbar colouring standard in Cascading Style Sheets (CSS), there is a way to colour the horizontal scrollbar in a <pre><code> block that will work in Edge, Safari, Firefox and Chrome.

Read the full story...

CSS logo

Fix a DIV to the top of a page with CSS

Posted 7th February 2014

No comments

Use pure CSS to position a DIV at the top of a web page so that when users scroll down, the DIV will remain visible at the top.

Read the full story...

Responsive images made easy

Posted 17th January 2014

3 comments

In this era of ‘Responsive Web Design’ where websites need to function well on smartphones and tablets as well as desktop computers, finding a solution for a website’s images can be tricky.

Read the full story...

Cross-domain support for embeded @font-face fonts in Firefox and Internet Explorer

Posted 13th October 2013

3 comments

A simple approach to getting cross-domain support for embedded @font-face fonts in Firefox and Internet Explorer.

Read the full story...

Creating a pure CSS ‘Print Friendly’ page accessible via a hyperlink

Posted 20th September 2013

No comments

In this tutorial, I shall demonstrate how to create a ‘Print Friendly’ version of your website with pure CSS and how to employ a small piece of JavaScript to make it accessible via a single click.

Read the full story...

Blog post thumnail

Simple CSS menu separators for navigation

Posted 9th September 2013

1 comment

Use CSS to Insert an unobtrusive image or a symbol as a separator between unordered or ordered list items that function as a navigation menu.

Read the full story...

Blog post thumnail

Getting started with Responsive Web Design

Posted 9th April 2012

11 comments

This article provides new users with ten easy-to-follow steps for designing a website on Responsive Web Design principles from scratch. RWD may look complicated, but this article will make it easy for you.

Read the full story...

Blog post thumnail

Create a clickable corner ribbon for your website

Posted 22nd January 2012

3 comments

Using CSS and simple HTML, easily create a promotional “ribbon” in the corner of your website that will link to another page.

Read the full story...

Blog post thumnail

Safely add any font to your website using CSS

Posted 10th January 2012

6 comments

Using @font-face in CSS3, you can easily add any font to your website and be certain that all of your users will see your custom font.

Read the full story...