Problems with Layout inherit in theme.json

by

I have in the theme.json of my FSE theme the following lines in the code:

"version": 2,
   "settings": {
      "layout": {
         "contentSize": "840px",
         "wideSize": "1100px"
      }
   }
}

If I now insert the following block in my index.html, it will be collapsed to the ContentSize width:

<!-- wp:group {"layout":{"inherit":true},"tagName":"main"} -->
<main class="wp-block-group">

<!-- wp:query -->
<div class="wp-block-query">
    <!-- wp:post-template -->
    <!-- wp:post-title /-->
    <!-- wp:post-date /-->
    <!-- wp:post-excerpt /-->
    <!-- /wp:post-template -->
 
    <!-- wp:query-pagination -->
    <div class="wp-block-query-pagination">
        <!-- wp:query-pagination-previous /-->
        <!-- wp:query-pagination-numbers /-->
        <!-- wp:query-pagination-next /-->
    </div>
    <!-- /wp:query-pagination -->
</div>
<!-- /wp:query -->
   
</main>
<!-- /wp:group -->

Now when I want to do the same in the Footer, the content is not collapsed to the ContentSize:

<!-- wp:group {"layout":{"inherit":true}} -->
<div class=""> Made by Reto Ulrich Mediendesign AG, <a href="https://www.rumede.ch" class="link-primary" target="_blank">www.rumede.ch</a> </div>
<!-- /wp:group -->

Can someone tell me when exactly the layout:inherit works, or what has to be considered for it? And is there a possibility to scale to the wideSize instead of the ContentSize?

1 Answer
1

To scale to wideSize you need to enable the wide alignment on the child block(s).

-The second code example is incomplete, perhaps that is why the width was not correct for the footer.

Leave a Comment