How to Resize Blocks in WordPress

How to Resize Blocks in WordPress

The Gutenberg Block Editor, introduced officially in WordPress 5.0, gives users the opportunity to fully customize their WordPress content and sites. No longer constrained by the need to create in a WYSIWYG tool like the TinyMCE Classic Editor, Gutenberg provides individual blocks for each element of the post’s or page’s content. With control over the settings for each specific block, users can design WordPress content more easily than ever before. And one of the simplest ways to make designs stand out is to take them beyond their default settings. So we’re going to look at how to resize blocks in WordPress so that you can start thinking (and designing) outside of the box.

Most resizing in the block editor is still constrained to the content area of the site due to the blocks’ responsive nature. If you have set your page’s content area to full-width, you will be working within that space. If you have a post content area set to from 580px or 1200px, for example, you will work there. The methods we’re using to teach you how to resize blocks in WordPress are all based on the idea that you will be staying within the borders of any particular block’s container.

Disclosure: Some of the links on this page are “affiliate links.” This means if you click on the link and purchase an item, we will receive an affiliate commission.
Build Divi WordPress Site
WordPress Site Care
Divi Tools
Web Design Solutions Unleashed Logo