Learn the ins and outs of padding and margin to set spacing on web elements. We’ll use practical design examples to demonstrate how to add space inside and outside of cards, images, headings, buttons, and Occam’s square.

00:00 – Introduction
00:44 – Padding & margin on one side
01:43 – Padding & margin on both sides
02:17 – Padding & margin on all sides
02:26 – Auto margin & centering
04:03 – Negative margin & overlapping
04:30 – Use cases & Occam’s square

———-
Get started with Webflow: https://wfl.io/2r7cVUW

https://webflow.com
https://twitter.com/webflow
https://facebook.com/webflow

source

35 Comments

  1. Why are these so good. Honest to God, if it wasn't for these training videos, I'd have moved on to a diff platform. Webflow is a big tool and its scary as an ultra n00b, but these videos REALLY make it easy to follow along and learn.

  2. One thing i noticed during those lessons is that Webflow has not only top-notched videos but also the kindest and funniest people writing in the comment section. That's called building a culture.
    edit*: comment::first-letter { text-transform: uppercase; }

  3. My Man this site-builder is amazing!🤩.
    I used it for a while and i can't express how many times ill smash 5*** ratings.
    -1 its easy and quite hard in the first day, but i learn new techniques evryday.
    -2 at least its better than wix.(dont hate on me ik wix is ez) reasons:
    -1 my test websit( i made for fun) worked properly,the S.E.O worked good just with
    Webflow.io as a placeholder,unlike the:/mysite1.u.n/wixsite.com

    Well its overall a good site builder. At least i can create my site from scratch instead of T E M P L A T E S.

    Good job👍🏻

  4. This series is great!

    One question: what is considered the best practice when trying to implement overlapping elements like what you showed on the video of the avatar going over the top of its card. I always thought using position: absolute/relative would be a better choice?

  5. Thanks for this! This is really one of the thing that makes me confused when switching from print design to web/UI design. You make this much easier to understand. 

    Keep up the good work Webflow team!

Leave A Reply

Please enter your comment!
Please enter your name here