What does 100% mean in CSS?

The attached article Show archive.org snapshot examines what the percent unit (%) is relative to in CSS

The article does a great job of visualizing the dependencies. The TLDR is:

Own property % of
height parent height
width parent width
top parent height
left parent width
margin-top parent width
margin-left parent width
padding-top parent width
padding-left parent width
translate-top own height
translate-left own width
Henning Koch Almost 3 years ago