CSS Box Model Tutorial – Padding, Margin, and Border

In this CSS video tutorial we cover the basics of padding, margin, and border (box model). Check out my “Get a Developer Job” course:

Have you created amazing pages with HTML & CSS and want to move them from your computer’s hard drive to online so the world can see them? The next step is to move your files to a web host. Learn about web hosts, my favorite hosting company, and how to save $40 on the only hosting plan you’ll need:

Sign up for my newsletter to receive periodic webDev tips, tricks, resources and coupons. Join the list at

Follow LearnWebCode on Twitter for resources and updates:


Posted

in

by

Tags:

Comments

26 responses to “CSS Box Model Tutorial – Padding, Margin, and Border”

  1. Abhra Biswas Avatar

    Great video, super informative

  2. Ayşegül Akcan Avatar

    Thanks learnWebCode..

  3. Michlep Avatar

    Really great explanation, Thanks a lot!

  4. Said'S_LogS Avatar

    awesome explanation, thanks !

  5. john smith Avatar

    How could I change my margin to a custom color like #948C96?

  6. Sree Lakshmi Avatar

    I was able to understand after watching this. Thank you.

  7. Abdullah Alaa Avatar

    been struggling over these for the past week ….not anymore
    muchas gracias

  8. revernance Avatar

    This is one of the best explanations on margin collapsing. Great teaching style, thank you!

  9. Dimitar Tsvetkov Avatar

    Very well explained, straightforward and right on the spot. Excellent video buddy. Keep it up!

  10. Rashad Bayram Avatar

    Indeed Great Visual explanation !

  11. Vader Avatar

    Finally i understand the big difference between margin and padding.Very helpful bro, thx a lot.:D

  12. mattlatch Avatar

    Really helpful. Thanks for making it clear.

  13. Shams Nelson Avatar

    Great stuff bro, God Bless

  14. Surendhar Sundaram Avatar

    Thanx a lot.. Rilli helpful.. Got a clear idea abt margins, padding and borders 🙂

  15. Andrew Voytas Avatar

    Awesome tip on margin collapsing. A lot of frustration eliminated. I can remember working on a web project setting two borders and frustrated because the margin was not doing what I thought I was telling it to do.

  16. Nokia Fanboys Avatar

    Hey man, one question, how can I Change the Color of the text, inside the box :)!? Thanks!

  17. Eric Karani Avatar

    I hope it will solve tha problem i have of understanding box model

  18. Hannah James Avatar

    Thank you SOOOOOO much i sat at TAFE for three hours swearing at the box model stuff were doing, i watched like half of this and finished my task in about 2 minutes… you are the best thing on youtube!!

  19. Russ Tock Avatar

    Being good at something and being good at teaching that something are 2 different qualities. You sir have both qualities – Excellent tutorials! Thank you!

  20. Christine Randall Avatar

    Nice simple explanation for beginners!

  21. Surendra Nath Avatar

    very nice thanks
    surendranath

Leave a Reply

Your email address will not be published. Required fields are marked *