Facing the CSS: Padding

Photo by Pankaj Patel on Unsplash

Psst! This blog is a continuation of Facing the CSS: Position! Feel free to check it out if you haven’t yet.

Following my journey of re-learning CSS, this time around I’m diving into the padding property. So what is padding? According to W3 Schools

Padding is used to create space around an element’s content, inside of any defined borders.

There are many ways you can set padding.

You can set the value for each side individually, as follows:

div.padding {    padding-top: 10px;    padding-right: 20px;    padding-bottom: 10px;    padding-left: 20px;}

Or, you can use the shorthand version and set the top, right, bottom, and left properties in that order:

div.padding {    padding: 10px 20px 10px 20px;}

If your top and bottom, and left and right properties have the same values, you can shorten then furthermore:

div.padding {    padding: 10px 20px;}

And of course, if all sides have the same value, you can specify in the same manner:

div.padding {    padding: 10px;}

You can specify values by length (fixed values: px, pt, cm, em, etc.), by percentage (%), or by global values (inherit: inherits padding value from its parent element, initial: default value, and unset).

Happy coding!

--

--

--

Laotian-American woman pursuing my passion for mentally stimulating and complex problem-solving through programming.

Love podcasts or audiobooks? Learn on the go with our new app.

Recommended from Medium

SQL Server— Update table using Inner join in SQL

Vector 2 Mod Apk 1.2.1 Unlimited Everything 2022

CS373 Spring 2022: An Vi Nguyen

Goldilocks and the Three Risk Management Programs

Code Review: How to transfer images using PyTorch

A “Revolutionary” MISTAKE In Tech Made By Us…

What’s the difference between a Core i3, Core i5 and Core i7?

Supporting Several Versions of JIRA in Your Add-on

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
Chindalath Traymany

Chindalath Traymany

Laotian-American woman pursuing my passion for mentally stimulating and complex problem-solving through programming.

More from Medium

How to charge more for social media designs

Apple Has Ruled Out A Metaverse For Its Mixed Reality Headset

Creating the Alphabet Cut-Outs, or: Generating a Passive Income

Why and how to use Instagram for artists.

How to be a professional artist on Instagram, social media, question and answer