Padding

5 minutes
Share the link to this page
Copied
  Completed
You need to have access to the item to view this lesson.
One-time Fee
$49.99
List Price:  $69.99
You save:  $20
€48.02
List Price:  €67.23
You save:  €19.21
£39.14
List Price:  £54.79
You save:  £15.65
CA$71.63
List Price:  CA$100.29
You save:  CA$28.65
A$80.06
List Price:  A$112.09
You save:  A$32.03
S$67.51
List Price:  S$94.52
You save:  S$27.01
HK$388.46
List Price:  HK$543.88
You save:  HK$155.41
CHF 44.24
List Price:  CHF 61.94
You save:  CHF 17.70
NOK kr563.34
List Price:  NOK kr788.73
You save:  NOK kr225.38
DKK kr358.57
List Price:  DKK kr502.03
You save:  DKK kr143.46
NZ$88.43
List Price:  NZ$123.81
You save:  NZ$35.37
د.إ183.61
List Price:  د.إ257.07
You save:  د.إ73.45
৳5,964.32
List Price:  ৳8,350.53
You save:  ৳2,386.20
₹4,269.04
List Price:  ₹5,977
You save:  ₹1,707.95
RM224.30
List Price:  RM314.04
You save:  RM89.74
₦77,264.53
List Price:  ₦108,176.53
You save:  ₦30,911.99
₨13,894.99
List Price:  ₨19,454.09
You save:  ₨5,559.10
฿1,708.15
List Price:  ฿2,391.55
You save:  ฿683.40
₺1,759.41
List Price:  ₺2,463.31
You save:  ₺703.90
B$318.75
List Price:  B$446.27
You save:  B$127.52
R937.33
List Price:  R1,312.34
You save:  R375
Лв93.99
List Price:  Лв131.59
You save:  Лв37.60
₩72,848.40
List Price:  ₩101,993.60
You save:  ₩29,145.19
₪182.43
List Price:  ₪255.42
You save:  ₪72.98
₱2,932.41
List Price:  ₱4,105.61
You save:  ₱1,173.20
¥7,857.17
List Price:  ¥11,000.67
You save:  ¥3,143.49
MX$1,008
List Price:  MX$1,411.29
You save:  MX$403.28
QR181.52
List Price:  QR254.14
You save:  QR72.62
P693.18
List Price:  P970.50
You save:  P277.32
KSh6,450.70
List Price:  KSh9,031.50
You save:  KSh2,580.80
E£2,541.20
List Price:  E£3,557.88
You save:  E£1,016.68
ብር6,354.82
List Price:  ብር8,897.26
You save:  ብር2,542.43
Kz45,590.88
List Price:  Kz63,830.88
You save:  Kz18,240
CLP$49,454.60
List Price:  CLP$69,240.40
You save:  CLP$19,785.80
CN¥364.87
List Price:  CN¥510.85
You save:  CN¥145.98
RD$3,040.26
List Price:  RD$4,256.60
You save:  RD$1,216.34
DA6,753.71
List Price:  DA9,455.74
You save:  DA2,702.02
FJ$115.90
List Price:  FJ$162.28
You save:  FJ$46.37
Q384.44
List Price:  Q538.26
You save:  Q153.81
GY$10,442.13
List Price:  GY$14,619.81
You save:  GY$4,177.68
ISK kr6,976.10
List Price:  ISK kr9,767.10
You save:  ISK kr2,791
DH503.31
List Price:  DH704.68
You save:  DH201.36
L920.86
List Price:  L1,289.28
You save:  L368.41
ден2,954.07
List Price:  ден4,135.94
You save:  ден1,181.86
MOP$399.27
List Price:  MOP$559.01
You save:  MOP$159.74
N$928.04
List Price:  N$1,299.34
You save:  N$371.29
C$1,836.54
List Price:  C$2,571.30
You save:  C$734.76
रु6,797.51
List Price:  रु9,517.06
You save:  रु2,719.54
S/185.85
List Price:  S/260.20
You save:  S/74.35
K202.57
List Price:  K283.61
You save:  K81.04
SAR187.71
List Price:  SAR262.82
You save:  SAR75.10
ZK1,381.27
List Price:  ZK1,933.89
You save:  ZK552.61
L239.16
List Price:  L334.85
You save:  L95.68
Kč1,208.85
List Price:  Kč1,692.49
You save:  Kč483.63
Ft19,737.39
List Price:  Ft27,633.93
You save:  Ft7,896.53
SEK kr544
List Price:  SEK kr761.65
You save:  SEK kr217.64
ARS$51,344.11
List Price:  ARS$71,885.87
You save:  ARS$20,541.75
Bs344.88
List Price:  Bs482.86
You save:  Bs137.98
COP$220,596.26
List Price:  COP$308,852.42
You save:  COP$88,256.15
₡25,341.90
List Price:  ₡35,480.70
You save:  ₡10,138.79
L1,268.10
List Price:  L1,775.44
You save:  L507.34
₲389,249.85
List Price:  ₲544,980.94
You save:  ₲155,731.08
$U2,221.61
List Price:  $U3,110.44
You save:  $U888.82
zł204.67
List Price:  zł286.56
You save:  zł81.88
Already have an account? Log In

Transcript

Today we are going to discuss about the padding How can you use or how can you define your padding to your element or on your element. So, first of all you have learned how can you use your margins make sure margin always works outside of the border are all sort of element parcels This is the border of the element and you are adding some space outside of the element. So this is the opposite that means this element held outside value this okay. So this is a margin. How padding is worth. Basically, in the CSS heading properties are used to generate a space around an element or content.

If you are using or inside of the orders for suppose this is the border. If you are using the heading, that means you are saying add some space inside of the element that means inside so this is your inside. So how can you do that, first of all, I need to add the padding to this. So this is our first element. So I have to call this class I have already called my class, then I have to use a party heading but you have to define which padding you are using padding top right, left or bottom I'm saying I need to add the padding on the top. That's why I need to call the padding and the top column and I'm saying 20 pixel.

Go to your page refresh the page. So now as you can see, you are adding the space inside of the element. So as you can see, this is your element. This is your Inside place of your element for if you are adding the padding right, you can add the padding right property And the values in pixels, which your page refresh the page because you have a lot of value, right sides. That's why it's not affecting if you are using left. So as you can see, it's fine working.

And if you want to add the heading, part and property, you need to add the value also in pixel. Go to save your file, go to your page, refresh the file. So now as you can see, you are adding the padding 40 pixel to this element in this way you're creating was but if you are using the padding individually side, so how can you do that? First of all I'm saying adding just try to make sure I'm not losing the position is the bottom edge of it. Just using the padding, and I'm saying add the padding from the 20 pixel pop. I'm saying 10 pixels, and I'm saying 40 pixels, and I'm saying it pixel, that means you have to add a semicolon.

That means I'm saying, and that 20 pixels from the top and the 10 pixel from the right, and the 14 pixel from the bottom at the 20 pixel from the right or left. So it was like you go to your page, refresh the page. So now as you can see, it's working fine. So in this way, you can define your padding for your element. Or suppose if you have a div if you have a div, and I'm saying, live, sorry, it's not a class. It's an element.

So that's why I have to say that element. I'm saying big round. Right or background color, red. Okay, I'm defining some elements inside the div. So fill up here. It's not currently a theory.

I'm saying, This is why paragraph one, I need to add the control the refresh. So now you can see it's showing one and the day, so that's why I'm saying, okay, refresh the page. It's working like this. If you are adding the padding to your table, how can you do that? I'm saying, padding, add the padding, 10 exam, and exam. And if you refresh the page, now you can see it's working fine.

You can also use a percentage or suppose 10% person Refresh the page. And you can also use 40%. Okay, I'm using person on call person. So this person, this person goes up refresh the page. Now as you can see, you can also add adding the person you can also use a person to your margin and you can also use the person to your text while working on the vehicle. Okay, so this way you can use a parody.

So in the next lecture, we are going to cover the width and the height in the CSS

Sign Up

Share

Share with friends, get 20% off
Invite your friends to LearnDesk learning marketplace. For each purchase they make, you get 20% off (upto $10) on your next purchase.