IT & Software Exam > IT & Software Videos > How to create Responsive Websites with DreamWeaver > Dreamweaver CS4 Tutorial - 14 - Padding and Margin with CSS
Dreamweaver CS4 Tutorial - 14 - Padding and Margin with CSS Video Lecture | How to create Responsive Websites with DreamWeaver - IT & Software
FAQs on Dreamweaver CS4 Tutorial - 14 - Padding and Margin with CSS Video Lecture - How to create Responsive Websites with DreamWeaver - IT & Software
| 1. What is the purpose of padding and margin in CSS? |  |
Ans. Padding and margin in CSS are used to control the spacing around an element. Padding adds space inside the element, while margin adds space outside the element.
| 2. How can I add padding to an element using CSS? | |
Ans. To add padding to an element using CSS, you can use the "padding" property and specify the desired value. For example, if you want to add 10 pixels of padding to all sides of an element, you can use the following CSS rule: "padding: 10px;"
| 3. How can I add margin to an element using CSS? | |
Ans. To add margin to an element using CSS, you can use the "margin" property and specify the desired value. For example, if you want to add 10 pixels of margin to all sides of an element, you can use the following CSS rule: "margin: 10px;"
| 4. Can I specify different padding or margin values for each side of an element? | |
Ans. Yes, you can specify different padding or margin values for each side of an element using the shorthand properties. For example, if you want to specify different padding values for the top, right, bottom, and left sides of an element, you can use the following CSS rule: "padding: 10px 20px 30px 40px;" This will apply 10 pixels of padding to the top, 20 pixels to the right, 30 pixels to the bottom, and 40 pixels to the left.
| 5. How does padding and margin affect the layout of an element? | |
Ans. Padding and margin can affect the layout of an element by adding space around it. Padding increases the size of the content area, which may cause the element to expand or overlap with other elements. Margin, on the other hand, creates space between the element and other elements around it, which can affect the overall positioning and spacing of the elements on the page.
Text Transcript from Video
hey welcome to the last beginner
tutorial on CSS in this tutorial we are
going to be going over the difference
between padding and margin this is a
very important concept to understand
when you're dealing with CSS when I
first started I did get a few times i
would get confused between what the
difference between padding and margin is
but after this tutorial you will
understand it alright so let's click on
the p2 text class and let's go to block
actually go to box and here we're going
to see a few options we're going to say
width and height and float and clear but
we're interested in for right now is
padding and margin so let's first let's
give it a padding of 10 pixels and a
margin of 10 pixels we're also going to
give it black background color and a
white color so just in case you can
catch that click on background change
the background color to black and then
click on type and the change the color
white then click apply all right so say
ok and I'm going to edit undo so you
guys can see the difference here i'm
going to edit into and then i'm going to
redo and what you'll notice is that it
scoots over to the left 10 pixels and it
also adds some space right here
so what is happening is there's a margin
of 10 and the margin is this white space
right here and then there's the padding
and the padding is actually what's
inside the paragraph it it has nothing
to do with what with what's going on
outside of the Mira graph to show you
that i'm going to change the padding to
20 and click down here and you can see
that inside it just crushed everything
in a little bit more and now i'm going
to change the padding which is going to
affect the business sitting on the
outside so change it to 20 there we go
you can see it moved over even more and
so basically the difference between the
margin and the padding is you think of
margin as being outside of the paragraph
and you think of padding as being inside
and hopefully that makes sense to all of
you if not make sure to leave some
comments if you have any questions about
the beginner CSS feel free to ask and
hopefully I can answer it as soon as
possible thanks for watching the
beginner tutorial and I will now be
doing some advanced tutorials and you
can follow those too thanks for watching
in don't forget to
tutorial on CSS in this tutorial we are
going to be going over the difference
between padding and margin this is a
very important concept to understand
when you're dealing with CSS when I
first started I did get a few times i
would get confused between what the
difference between padding and margin is
but after this tutorial you will
understand it alright so let's click on
the p2 text class and let's go to block
actually go to box and here we're going
to see a few options we're going to say
width and height and float and clear but
we're interested in for right now is
padding and margin so let's first let's
give it a padding of 10 pixels and a
margin of 10 pixels we're also going to
give it black background color and a
white color so just in case you can
catch that click on background change
the background color to black and then
click on type and the change the color
white then click apply all right so say
ok and I'm going to edit undo so you
guys can see the difference here i'm
going to edit into and then i'm going to
redo and what you'll notice is that it
scoots over to the left 10 pixels and it
also adds some space right here
so what is happening is there's a margin
of 10 and the margin is this white space
right here and then there's the padding
and the padding is actually what's
inside the paragraph it it has nothing
to do with what with what's going on
outside of the Mira graph to show you
that i'm going to change the padding to
20 and click down here and you can see
that inside it just crushed everything
in a little bit more and now i'm going
to change the padding which is going to
affect the business sitting on the
outside so change it to 20 there we go
you can see it moved over even more and
so basically the difference between the
margin and the padding is you think of
margin as being outside of the paragraph
and you think of padding as being inside
and hopefully that makes sense to all of
you if not make sure to leave some
comments if you have any questions about
the beginner CSS feel free to ask and
hopefully I can answer it as soon as
possible thanks for watching the
beginner tutorial and I will now be
doing some advanced tutorials and you
can follow those too thanks for watching
in don't forget to
Related Exams
About this Video
|
4.67/5 Rating |
|
Dec 23, 2024 Last updated |
Video Description: Dreamweaver CS4 Tutorial - 14 - Padding and Margin with CSS for IT & Software 2024 is part of How to create Responsive Websites with DreamWeaver preparation.
The notes and questions for Dreamweaver CS4 Tutorial - 14 - Padding and Margin with CSS have been prepared according to the IT & Software exam syllabus.
Information about Dreamweaver CS4 Tutorial - 14 - Padding and Margin with CSS covers all important topics for IT & Software 2024 Exam.
Find important definitions, questions, notes, meanings, examples, exercises and tests below for Dreamweaver CS4 Tutorial - 14 - Padding and Margin with CSS.
Introduction of Dreamweaver CS4 Tutorial - 14 - Padding and Margin with CSS in English is available as part of our How to create Responsive Websites with DreamWeaver for IT & Software & Dreamweaver CS4 Tutorial - 14 - Padding and Margin with CSS in
Hindi for How to create Responsive Websites with DreamWeaver course. Download more important topics related with notes, lectures and mock test series for
IT & Software Exam by signing up for free.
Description
Video Lecture & Questions for Dreamweaver CS4 Tutorial - 14 - Padding and Margin with CSS Video Lecture | How to create Responsive Websites with DreamWeaver - IT & Software - IT & Software full syllabus preparation | Free video for IT & Software exam to prepare for How to create Responsive Websites with DreamWeaver.
Information about Dreamweaver CS4 Tutorial - 14 - Padding and Margin with CSS
Here you can find the meaning of Dreamweaver CS4 Tutorial - 14 - Padding and Margin with CSS defined & explained in the simplest way possible.
Besides explaining types of Dreamweaver CS4 Tutorial - 14 - Padding and Margin with CSS theory, EduRev gives you an ample number of questions to practice Dreamweaver CS4 Tutorial - 14 - Padding and Margin with CSS tests,
examples and also practice IT & Software tests.
|
Explore Courses for IT & Software exam
|
|
Signup for Free!
Signup to see your scores go up within 7 days! Learn & Practice with 1000+ FREE Notes, Videos & Tests.
Related Searches
mock tests for examination
,Important questions
,Semester Notes
,Previous Year Questions with Solutions
,Objective type Questions
,Sample Paper
,shortcuts and tricks
,MCQs
,Free
,ppt
,practice quizzes
,Dreamweaver CS4 Tutorial - 14 - Padding and Margin with CSS Video Lecture | How to create Responsive Websites with DreamWeaver - IT & Software
,Viva Questions
,Summary
,Exam
,video lectures
,Dreamweaver CS4 Tutorial - 14 - Padding and Margin with CSS Video Lecture | How to create Responsive Websites with DreamWeaver - IT & Software
,study material
,Dreamweaver CS4 Tutorial - 14 - Padding and Margin with CSS Video Lecture | How to create Responsive Websites with DreamWeaver - IT & Software
,Extra Questions
,past year papers
;
Study Dreamweaver CS4 Tutorial - 14 - Padding and Margin with CSS on the App
Students of IT & Software can study Dreamweaver CS4 Tutorial - 14 - Padding and Margin with CSS alongwith tests & analysis from the EduRev app,
which will help them while preparing for their exam. Apart from the Dreamweaver CS4 Tutorial - 14 - Padding and Margin with CSS,
students can also utilize the EduRev App for other study materials such as previous year question papers, syllabus, important questions, etc.
The EduRev App will make your learning easier as you can access it from anywhere you want.
The content of Dreamweaver CS4 Tutorial - 14 - Padding and Margin with CSS is prepared as per the latest IT & Software syllabus.
|
© EduRev
|
Education Revolution
|
|
Signup to see your scores
go up within 7 days!
Access 1000+ FREE Docs, Videos and Tests
Takes less than 10 seconds to signup