An interesting CSS fact that blew my mind

I am a software developer by profession and I thought I knew CSS pretty well till I stumbled upon this today: “Any margin or padding specified as a percentage is calculated based on the width of the containing element”

This means margin-top: 10% essentially translates to: the margin on the top of the current element is set to 10% of the width of the containing element and not its height, as is assumed by many(including myself). Interestingly, the reason why the specification is written this way is still, technically, unknown.

Software Engineer at AirAsia

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store