Responsive Column Docs

Responsive Page Layouts

Holy Grail Layout

Left Sidebar Layout

Right Sidebar Layout

Full Page Layout

Responsive Column Sets

1 Column

2 Columns

3 Columns

4 Columns

5 Columns

6 Columns

7 Columns

8 Columns

Responsive website layout

Web Design (CSS Layouts, Experiments & Demos)

Matthew James Taylor12 September 2007
Updated 2 January 2022

I've been working professionally as a web developer for over 21 years and this website is where I share my best web design tips and insights.

I have a strong focus on responsive layouts and their underlying CSS and I provide lots of downloadable demos that you can play with.

Latest Web Design Articles

Racing car made from custom tags

Custom HTML Tags (18 Things To Know Before Using Them)

Webjets.io - How To Publish Content
Web design
Looking into an empty div

Empty HTML Tags (21 Weird Things You Need To Know!)

Web design
Columns all the same height

Equal-Height Columns (CSS Grid, Flexbox, Floated Containers, & Table Methods)

Web design
How to add CSS to HTML

How to add CSS to HTML (With Link, Embed, Import, and Inline styles)

Web design
A delicious soup made from custom elements

Replace Divs With Custom Elements For Superior Markup

Web design
Padding bewteen desktop, tablet, and mobile

Responsive Padding, Margin & Gutters With CSS Calc

Web design
Superman blocking styles

Style Blocker: How To Prevent CSS Cascade With Shadow DOM

Web design
Responsive text size

Responsive Font Size (Optimal Text at Every Breakpoint)

Web design
Responsive Columns Layout System

Responsive Columns: Build Amazing Layouts With Custom HTML Tags

Web design
Responsive house plan

Responsive House Plan (Web Design Meets Architecture!)

Architecture
Boggle dice shaker

Boggle Dice Shaker (Built With Javascript)

Web design
Footer at the bottom of the page

Get Down! How to Keep Footers at the Bottom of the Page

Web design
Is CSS margin top or bottom better?

CSS: Margin Top vs Bottom (A Trick You Should Know)

Web design
Beautiful centered menus with CSS

CSS: Horizontally Centred Menus (With Optional Dropdowns)

Web design
Ads that can change size to fit any screen size

Responsive Banner Ads with HTML5 and CSS3

Web design

My Web Development Skills

I don't have any formal web development qualifications but I do have over 20 years of professional experience working as a web developer.

When I started building websites in 1997 there weren't any readily available courses to attend so I didn't have a choice! We all just had to figure it out by ourselves and learn from each other online. It was a completely different vibe back then.

As the web advanced I kept up with the latest changes by implementing new technologies wherever I worked at the time. I find I learn best by doing anyway.

I experimented a lot with web design particularly on this website, and I shared my discoveries and observations by blogging.

I've been an active member of Stack Overflow for over 12 years and I often answer people's web design questions there (and ask some too).

My Web Development History

Before becoming a full-time blogger, I was employed at Nine Entertainment Co. where I work on their high-profile network sites including Nine.com.au, 9News, Wide World of Sports, 9Now, 9Honey, and many more.

In 2014, while working for Student Services Australia, I single-handedly rebuilt Flatmates.com.au from scratch. As part of the build, I designed the website architecture to maximize SEO and I implemented a responsive design for mobile users.

Flatmates quickly became the #1 share accommodation website in Australia and it was sold to realestate.com.au for $25M shortly after.

I worked as the lead developer for the CeBit Australia's website in 2010 and built their exhibition ticketing engine for their technology expo of that year.

In 2006 I was the lead developer and SEO strategist for PropertyLook (a commercial real estate website) where I helped move our traffic ranking from 3rd to 2nd place in the market. PropertyLook was sold to realestate.com.au for $9M and combined with their existing commercial real estate website.

I've also worked as a web developer for many other small and large companies including Microsoft.

Web Design Portfolio

Kidsit babysitting

Kidsit

I created this website to share everything I've learned while caring for my three kids over the past 12 years.

Kidsit is aimed at parents and childcarers such as babysitters and nannies or anyone who is looking after children and may benefit from some helpful parenting advice.

I teamed up with a group of the most amazing people who are experts in childcare and child health so I can be confident that the information I'm writing about is reliable and useful. It feels good to be helping people too.

Here are my most popular articles for parents:

And the most popular for babysitters:

If you have kids or know someone who does, check out Kidsit.com.

Kevin Taylor Art

Kevin Taylor Art Classes

I built this website for my Dad who was an extremely talented artist. He painted in oils professionally and taught private art classes for over 30 years. I'm sure I get my creativity from him.

I designed his website to advertise his art classes on the Gold Coast and also serve as an online art gallery for his artworks, and also art by his students.

The website contains 888 works by 137 artists but this is only a fraction of the work Dad helped people create over his career.

My Dad passed away in early 2018 but his website will remain online for everyone to enjoy. One of Dad's students is continuing his classes.

Check out KevinTaylorArt.com

...

I've worked on many other excellent sites that are no longer online, such is the nature of today's fast-paced internet, nothing lasts forever.

I can't forget to mention my personal website (the one you're reading now). This is my longest-running site, it's been online in various forms since 1997. See my about page for the full website history.