...
In HTML, all elements are considered boxes. You may even hear people refer to this as the "box model" when reading about design and layout. The visual builder marks makes working with the boxes easy by allowing control over the Margin, Border and Padding settings. Before diving in to changing the settings, let's go over what the box model looks like visually.
...
You might notice that the slider is in the middle even when the value is at zero. The visual builder allows for negative margin which is an advanced concept used to pull elements over the top of other elements. If you're interested in reading more about negative margin, we'll leave that up to Smashing Magazine's Definitive Guide to Using Negative Margin.
...
You can control individual padding on the Top, Sides or Bottom using the first three settings. Alternatively there is a forth setting labeled "Padding" which gives you a way to set the padding to 5, 10, 15, 20 or 25 pixels on all sides. Let's take a look at a headline element with a complete border around it, but no padding.
...
Similar to the Border, we can choose to put the padding "PADDING ON" only on the text. Typically you will only do that if you're also putting the border on "BORDER ON" to the text as well. For fun let's look at what moving the padding and border to the Text instead of the element would look like on this headline.
...