This advanced but powerful block allows you to create any layout specific to the user’s device size.
Two equal columns
Column #1
Column #2
These columns are horizontally aligned on desktop but stacked vertically on Tablet or Mobile. Both columns are containers whose sizing is set to ‘fill.’
Two columns, one sized to content.
Fill Column
Sized
Only the first column container is set to fill.
Code Editor
<!-- wp:mindspun/container {"blockId":"34_60a75d-1","link":"https://www.mindspun.com","target":"_blank","style":{"display":"flex","justifyContent":"center","alignItems":"center","paddingTop":"3em","paddingRight":"3em","paddingBottom":"3em","paddingLeft":"3em","backgroundColor":"#b1c5a4","width":"620px"}} -->
<div class="wp-block-mindspun-container wpx--cursor-pointer" id="wpx-34_60a75d-1" role="button" tabindex="0" onclick="javascript:window.open('https://www.mindspun.com', '_blank')"><!-- wp:paragraph -->
<p>This container is clickable!</p>
<!-- /wp:paragraph --></div>
<!-- /wp:mindspun/container -->Container with box-shadow
Code Editor
<!-- wp:mindspun/container {"blockId":"34_56a1f3-1","style":{"boxShadow":"5px 5px 10px #ccc","backgroundColor":"#c2a990","paddingTop":"3em","paddingRight":"3em","paddingBottom":"3em","paddingLeft":"3em","width":"620px"}} -->
<div class="wp-block-mindspun-container" id="wpx-34_56a1f3-1"><!-- wp:mindspun/paragraph {"blockId":"34_1b30d5-1","text":"Default box shadow","style":{"textAlign":"center"}} -->
<p class="wp-block-mindspun-paragraph" id="wpx-34_1b30d5-1">Default box shadow</p>
<!-- /wp:mindspun/paragraph --></div>
<!-- /wp:mindspun/container -->