I have a wordpress website with gutenberg editor.
When i use some blocks, there is missing generated CSS.
For example, with the "row" block, when the "Allow to wrap to multiple lines" is unchecked, a "is-nowrap" class is added to the html element but there is no css for the class.
Another example with the "group" block. I set a specific width of 50% for the block but nothing is done in front. A "wp-container-content-3" class is added to the element so i imagine the specific settings may be in it but there is no css in the page for this class.
Some other class has generated inline CSS, for example "is-layout-flex" is working.
Am i missing something ?
Is there some code to add for this inline CSS generation ?
Thank you (and sorry for my english).
EDIT :
The problem was that the wp_head() method was called before some do_blocks() methode (PHP templates), so the CSS generated in these do_blocks() wasn’t added.
Source : https://fullsiteediting.com/lessons/how-to-use-php-templates-in-block-themes/#h-making-sure-that-wordpress-loads-the-block-css
2
Answers
The WordPress theme you are using does not support the (fairly new) layout classes, introduced with WordPress 6.1, it seems. The theme author needs to provide an update for this to work (or you need to switch themes).
See this blog post for a comprehensive walk-through.
I was having a different issue but I found this thread while trying to debug. My
core/embed
blocks seemed to be missing styles and weren’t rendering properly (wrong height and aspect ratio despite having the class.wp-embed-aspect-16-9
, which didn’t seem to be doing anything).So if you’re here having the same issue with embed blocks but your other blocks are fine, you probably just need to drop
add_theme_support( 'responsive-embeds' );
into your theme.