Home

Absolute vs. Relative Positioning

The golden rule of absolute positioning.

If you've ever tried to lay out an HTML page with a second column or sidebar, I'd bet you ran into an issue with the position property at one point or another.

I was struggling with this until I came across advice I will now never forget. This is the golden rule of absolute positioning:

An absolutely positioned element is positioned relative to the closest ancestor that is positioned relatively.

In other words, if you want to absolutely position an element in relation to its parent, the parent MUST be relatively positioned.

As usual, Chris Coyier has some good examples.

Let's Connect

Keep Reading

Are You Overthinking CSS?

CSS is inherently simple. Maybe you're overthinking it. Maybe you don't need some crazy system guiding your CSS. Maybe you just need a few simple rules.

Dec 16, 2018

Select the Last n Children in CSS

Sometimes you need to target more than just the last child in a series of HTML elements. Learn how to target the last n number of elements here.

Dec 20, 2014

Everything You Need to Know about CSS Position Property

Dive deep into CSS position with real examples.

Pratham
Aug 19, 2021