Margins & Padding

You can set individual margins and padding independently for top, bottom, left and right. You can set all of these values independently for large (desktop), medium (tablet), and small (phone) devices. When you add a custom margin or padding setting to an individual row, column, or module, this setting is automatically used for medium devices as well, unless you specifically add a different setting for medium devices. For example, if you set a top margin on a row to 100 px, tablets will also dis...

Auto spacing on mobile devices is enabled by default in PageBuilder. In general, it reduces the amount of space between rows, columns, and modules on mobile devices automatically, to save you time adding your own values. See the article on troubleshooting margins and padding (/810252-Troubleshooting-responsive-margins-and-padding) to see how auto spacing works under various conditions. If you want fine-grained control over spacing in your layouts, you may prefer to disable auto spacing. TIP A...

While basic margin and padding spacing is very easy in PageBuilder, it can get complicated when you want to exert finer control over individual settings. If you can't figure out why one of your settings doesn't seem to be showing on the published page, it may be helpful to read the technical information here about how settings, propagation, overrides, and auto spacing interact to settle on a final value. Factors that influence the final margin or padding value There are a number of factors ...

PageBuilder has the following built-in spacing defaults. - Rows and columns have default margins and padding. - Modules have default margins. - An auto spacing feature (https://docs.wpbeaverbuilder.com/beaver-builder/layouts/margins-padding/troubleshooting-margins-and-padding/#auto-spacing) for small devices is enabled by default. This feature reduces spacing automatically on mobile devices. This means the layout should look decent at all device sizes without any special effort at man...