diff --git a/docs/reference-guides/core-blocks.md b/docs/reference-guides/core-blocks.md index 44561fdecfcf70..c6ad73b64c34fc 100644 --- a/docs/reference-guides/core-blocks.md +++ b/docs/reference-guides/core-blocks.md @@ -646,7 +646,7 @@ Add text that respects your spacing and tabs, and also allows styling. ([Source] - **Name:** core/preformatted - **Category:** text -- **Supports:** anchor, color (background, gradients, text), typography (fontSize, lineHeight) +- **Supports:** anchor, color (background, gradients, text), spacing (margin, padding), typography (fontSize, lineHeight) - **Attributes:** content ## Pullquote diff --git a/packages/block-library/src/preformatted/block.json b/packages/block-library/src/preformatted/block.json index f781cb1125efa0..ec6ea839385eb2 100644 --- a/packages/block-library/src/preformatted/block.json +++ b/packages/block-library/src/preformatted/block.json @@ -25,6 +25,10 @@ "text": true } }, + "spacing": { + "padding": true, + "margin": true + }, "typography": { "fontSize": true, "lineHeight": true, diff --git a/packages/block-library/src/preformatted/style.scss b/packages/block-library/src/preformatted/style.scss index 71e60ffe4ea529..783fee74d4f4fa 100644 --- a/packages/block-library/src/preformatted/style.scss +++ b/packages/block-library/src/preformatted/style.scss @@ -1,7 +1,10 @@ .wp-block-preformatted { + // This block has customizable padding, border-box makes that more predictable. + box-sizing: border-box; white-space: pre-wrap; } -.wp-block-preformatted.has-background { +// Add low specificity default padding when a background is used. +:where(.wp-block-preformatted.has-background) { padding: $block-bg-padding--v $block-bg-padding--h; }