What’s this new frontend CSS ouptut in 6.5?

I dug around looking at some of my other sites, and apparently the global inline css output has had the !important flags for awhile now, at least going back to 6.2. I still maintain that this is really dumb to include !important in default core css, but it’s not the root cause of my problem.

The problem I’m seeing in 6.5 is that they changed where the “is-layout-constrained” class is applied.

Previously, it was on the main outer group div. So the CSS in question would then only apply to its immediate child, the inner container. No prob.

<div class="wp-block-group is-layout-constrained wp-block-group-is-layout-constrained">

In 6.5 it has moved “is-layout-constrained” to the INNER container.

<div class="wp-block-group">
   <div class="wp-block-group__inner-container is-layout-constrained wp-block-group-is-layout-constrained">

This means that this sloppy CSS rule now applies to every immediate child element inside a group’s inner container:

body .is-layout-constrained > :where(:not(.alignleft):not(.alignright):not(.alignfull)) {

So if I have a heading, an image, whatever, inside a group, it now is forced to have auto left/right margins !important. That’s really gross.

• This reply was modified 3 months, 4 weeks ago by evanltd.
• This reply was modified 3 months, 4 weeks ago by evanltd.

Ok, with more research I’ve concluded that even though I actually love the Gutenberg editor itself, clearly this push toward “block themes” and “full site editing” is not for me. After nearly 20yrs of using WP as a CMS rather than a pagebuilder, writing custom PHP and CSS and enjoying the separation of content and design, it’s hard to wrap my head around how visually click-designing an entire website in the block editor would ever be faster, easier, less aggravating—or even possible given the amount of customization we put into our sites.

Guess I’m stuck being a dinosaur for now, which means not creating a theme.json, and disabling new features as they arrive. Here are two ways to disable the global inline css output. Both seem to work for me. I’m not sure which approach is more proper.

function remove_global_styles_and_svg_filters() {
	remove_action( 'wp_enqueue_scripts', 'wp_enqueue_global_styles' );
	 remove_action( 'wp_body_open', 'wp_global_styles_render_svg_filters' );
}
 add_action('init', 'remove_global_styles_and_svg_filters');

OR:

function remove_global_styles(){
    wp_dequeue_style( 'global-styles' );
}

add_action( 'wp_enqueue_scripts', 'remove_global_styles' );