WordPress 6.6 beta-1: Double global padding on nested blocks

  • Hi,
    i tested WordPress 6.6 beta-1 with the default theme Twenty Twenty-Four and it seems that this CSS rule has been removed to prevent double padding on nested blocks with the “has-global-padding” CSS class:

    .has-global-padding :where(.has-global-padding:not(.wp-block-block)) {
    padding-right: 0;
    padding-left: 0;
    }

    To check the issue you can add this code inside a page:

    <!-- wp:group {"align":"wide","layout":{"type":"constrained"}} -->
    <div class="wp-block-group alignwide"><!-- wp:heading {"textAlign":"center"} -->
    <h2 class="wp-block-heading has-text-align-center">H2 Title</h2>
    <!-- /wp:heading -->

    <!-- wp:columns {"align":"wide"} -->
    <div class="wp-block-columns alignwide"><!-- wp:column -->
    <div class="wp-block-column"><!-- wp:heading {"level":4} -->
    <h4 class="wp-block-heading">Sample title</h4>
    <!-- /wp:heading -->

    <!-- wp:paragraph -->
    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. </p>
    <!-- /wp:paragraph --></div>
    <!-- /wp:column -->

    <!-- wp:column -->
    <div class="wp-block-column"><!-- wp:heading {"level":4} -->
    <h4 class="wp-block-heading">Sample title</h4>
    <!-- /wp:heading -->

    <!-- wp:paragraph -->
    <p>Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
    <!-- /wp:paragraph --></div>
    <!-- /wp:column --></div>
    <!-- /wp:columns --></div>
    <!-- /wp:group -->

    thanks


Viewing 4 replies - 1 through 4 (of 4 total)

  • The 6.6. Beta 2 is currently available – can you still reproduce the problem there?

    Also as a tip just to be on the safe side: deactivate all plugins to rule out that one of them is interfering.

    Thread Starter Fabio Rubioglio

    (@fabiorubioglio)

    Hi,
    Thanks for your reply.
    it seems that the CSS rule

    .has-global-padding :where(.has-global-padding:not(.wp-block-block)) {
    padding-right: 0;
    padding-left: 0;
    }

    has been rewritten:

    .has-global-padding :where(.has-global-padding:not(.wp-block-block, .alignfull, .alignwide)) {
    padding-right: 0;
    padding-left: 0;
    }

    has-global-padding CSS rule now applies to nested elements with .alignfull and .alignwide selector. This changes the width of the child elements with .alignwide selector.

    In the meantime, someone else has also reported the problem to the Gutenberg team: https://github.com/WordPress/gutenberg/issues/62597

    Thread Starter Fabio Rubioglio

    (@fabiorubioglio)

    Hi @threadi thanks for the response. The global padding logic has changed.

Viewing 4 replies - 1 through 4 (of 4 total)
  • You must be logged in to reply to this topic.