The recent update of Google Chrome 77 has broken the layout of webpages in Gutenberg and elsewhere where a height of 100% applies in the CSS.

Here's how this can be fixed for Gutenberg editor so the entry content can be seen again.

But first, before and after screenshots.



Step 1

The following code can go inside your active theme's functions.php or a custom functionality plugin or in a snippet using the Code Snippets plugin.

Install and activate Code Snippets plugin.

Go to Snippets > Add New.

Title: Fix Gutenberg editor issue with Chrome 77


 * Modify the height of a specific CSS class to fix an issue in Chrome 77 with Gutenberg.
 * @see
	function() {
		echo '<style>.block-editor-writing-flow { height: auto; }</style>'; // phpcs:ignore

Credit: James Burke via.

Need help implementing a tutorial in your site or want to hire me for custom work?


Find the article helpful and wish to donate?



You need to be logged in to view and post comments.
Not a member yet? Join here.
linkedin facebook pinterest youtube rss twitter instagram facebook-blank rss-blank linkedin-blank pinterest youtube twitter instagram
%d bloggers like this: