Do these 3 things before closing this tab:
1Repair Windows errors before they cause bigger problems2Fix the driver behind crashes, sound loss and screen glitches3Clear out junk files and repair common Windows errorsIn WordPress, padding adds space inside a block’s border; margin adds space outside it. Use padding when the block’s background or border should extend around the extra room, and margin when you want to separate that block from nearby content. A third setting, block spacing, controls gaps between nested blocks inside a container.
Padding and margin: the practical difference
The CSS box model arranges a block’s box from the inside out: content, padding, border, then margin. The W3C describes a box as having a content area and optional surrounding padding, border, and margin areas (CSS 2.2 box model). WordPress’s Styles overview puts it simply: “Padding is the space between a block’s content and its border, whereas Margin is the space outside the border of a block” (WordPress.org Styles overview).
| Setting | Where the space goes | What it is usually for | What happens to the block’s background and border |
|---|---|---|---|
| Padding | Between content and border | Interior breathing room in a component, such as a button, Group, or call-to-action | The background and border extend around the padded area |
| Margin | Outside the border | Separation between a block and surrounding blocks or sections | The added space sits outside the block’s background and border |
| Block spacing | Between nested blocks in a container | Consistent gaps among items inside a Group or Columns block | It sets gaps between child blocks rather than enlarging the container or an individual block |
These settings affect different relationships: padding changes the room inside a block, margin changes its relationship to neighbors, and block spacing sets gaps between children in a layout container. Learn WordPress describes margin as space around a block, commonly used to create gaps between elements, and block spacing as a way to manage spacing between blocks in a container (Learn WordPress: Using the Block Editor).
When to use padding or margin
Choose padding for room inside a component
Increase padding when text or other content needs breathing room while remaining inside the same visual component. For example, padding on a Button block can keep its background around the text while making the button feel less cramped; on a Group block, it can create space between the group’s content and its edge.
Choose margin to separate blocks
Use margin when a heading, image, or section needs more distance from neighboring content. The gap remains outside the block’s border, so it does not enlarge the block’s colored background. If you want the same gap between several children in one container, use block spacing rather than adding margin to each child individually.
How to change spacing in the Block Editor
- Select the block you want to adjust in the editor.
- Open its Settings sidebar, then look in Styles and Dimensions for padding or margin controls. The exact panel and available controls depend on the block and active theme.
- Set a value. When the sides are linked, one value applies to all sides. Unlink them to set top, right, bottom, and left separately—for example, to add more room above a heading than beside it.
- Choose a supported unit if the control offers a unit selector. WordPress documents px, %, em, rem, vw, and vh for these controls (WordPress.org Styles overview).
- Check the result in the editor. The editor highlights the changed dimension around the block, which helps distinguish interior padding from outside margin.
For a gap between nested blocks, select the container—such as Group or Columns—and look for its block spacing control. Its availability and label can also depend on the block and theme.
Why the Dimensions or spacing control may be missing
Spacing controls are not guaranteed to appear for every block in every theme. The active block may not support a particular setting, or the theme may not expose that spacing feature. WordPress’s theme.json reference includes settings for custom margin and padding, supported units, and margin and padding styles for individual sides (theme.json reference). The Theme Handbook explains that enabling blockGap, margin, or padding makes the corresponding interface controls available for supported blocks and can provide CSS custom properties for presets (Global settings and styles).
- Select the specific block and inspect its Styles or Dimensions panels; another block may offer different options.
- If a control remains absent, check whether the active theme enables that spacing feature.
- If the theme or block does not expose the setting, a custom CSS class may be an alternative, but it requires editing CSS rather than using that visual control.
WordPress version context
WordPress 6.1 introduced preset values for padding, margin, and block gap, according to a WordPress Core development note dated October 7, 2022 (Gutenberg 14.2 development note). Presets are theme-provided options; their presence does not mean every block or theme will show the same spacing controls.
Quick Recap
Product prices and availability are accurate as of the date/time indicated and are subject to change. Any price and availability information displayed on Amazon at the time of purchase will apply.
