Understanding Padding in CSS Box Model (Urdu/Hindi)

This post’s video is no longer on YouTube. The notes below are the post.

Welcome to Episode 10 by Zaions!

This video is all about the padding property in CSS and its role in the CSS box model.

The role of padding in CSS Box Model

Padding properties explained: top, right, bottom, left

How padding affects element dimensions

Limitations and future lessons

Padding and the CSS Box Model

Padding is the space that surrounds the content of a HTML element. I'll explain how it's added to the width and height of the element and demonstrate how to manipulate it.

Padding Properties Explored

In this tutorial, you'll be introduced to various padding properties such as padding-top, padding-right, padding-bottom, and padding-left. For now, we will use "px" as the unit for padding, which will be expanded upon in future lessons.

Experiment with different padding settings

Stay Updated

Want us to build yours instead?

On a project, every milestone ends with a link to the working build, and the code, the accounts and every password are yours at the handover.

What we’d build for you is on Services.

Send us the brief, or start with the free call.

Page updated .

Privacy preferences

Choose whether this browser sends visit data to our analytics tools. The site works the same either way.

Google Analytics, Amplitude and Microsoft Clarity show us which pages get read. Off means none of the three loads.

Always on

Sentry error reports, with personal data removed, and the Cloudflare spam check on the brief form.

Each cookie is listed in our Cookie Policy.