Title: Modify the initial gap value for core/columns Last modified: January 20, 2023 --- # Modify the initial gap value for core/columns * [rose18](https://wordpress.org/support/users/rose18/) * (@rose18) * [3 years, 4 months ago](https://wordpress.org/support/topic/modify-the-initial-gap-value-for-core-columns/) * Hi, * I want to modify the initial gap value for the core/columns block. By default, if I didn’t adjust the ‘Block Spacing’ under the Dimension panel for core/columns, it will take the blockGap value from in the theme.json file(see below). * ```wp-block-code { "version": 2, "styles": { "spacing": { "blockGap": "1rem" } } } ``` * The CSS for the core/column will look like this: * ```wp-block-code body .is-layout-flex { gap: 1rem; } ``` * When I adjust the ‘Horizontal’ value under ‘Block Spacing’, * ![](https://i0.wp.com/snipboard.io/Sjv7iJ.jpg?ssl=1) * the css for the core/column is: * ```wp-block-code .wp-block-columns.wp-container-13 { gap: 2em var(--wp--preset--spacing--small); } ``` * Or vice versa, when ‘Vertical’ value is set, * ![](https://i0.wp.com/snipboard.io/S6r0RF.jpg?ssl=1) * ```wp-block-code .wp-block-columns.wp-container-13 { gap: var(--wp--preset--spacing--small) 2em; } ``` * I want to change that **2em** value from the CSS above to another value. How do I change that default value to **1rem**? * Thanks! Viewing 7 replies - 1 through 7 (of 7 total) * Moderator [threadi](https://wordpress.org/support/users/threadi/) * (@threadi) * [3 years, 3 months ago](https://wordpress.org/support/topic/modify-the-initial-gap-value-for-core-columns/#post-16442113) * The 2nd value for the CSS property gap is the column-gap property. You can also set it separately. * ```wp-block-code body .wp-block-columns { column-gap: 1em; } ``` * Thread Starter [rose18](https://wordpress.org/support/users/rose18/) * (@rose18) * [3 years, 3 months ago](https://wordpress.org/support/topic/modify-the-initial-gap-value-for-core-columns/#post-16457550) * Hi [@threadi](https://wordpress.org/support/users/threadi/) , * I did try adding this css code: * ```wp-block-code body .wp-block-columns { column-gap: 4rem; row-gap: 4rem; } ``` * But if I adjust the ‘Horizontal’ or Vertical’ value under ‘Block Spacing’, the values set in the editor overrides the css that I have added. * ![](https://i0.wp.com/snipboard.io/aEeMox.jpg?ssl=1) * Moderator [threadi](https://wordpress.org/support/users/threadi/) * (@threadi) * [3 years, 3 months ago](https://wordpress.org/support/topic/modify-the-initial-gap-value-for-core-columns/#post-16458078) * Give the property a higher value with !important. * ```wp-block-code body .wp-block-columns { column-gap: 1em !important;} ``` * Thread Starter [rose18](https://wordpress.org/support/users/rose18/) * (@rose18) * [3 years, 3 months ago](https://wordpress.org/support/topic/modify-the-initial-gap-value-for-core-columns/#post-16462087) * Thanks [@threadi](https://wordpress.org/support/users/threadi/) ! * I don’t think this will work. If I add !important to column-gap or row-gap, then if I want to adjust the horizontal or vertical block spacing, then it will take the !important css. Below is my custom css code (highlighted in yellow) * ![](https://i0.wp.com/snipboard.io/UHDVdO.jpg?ssl=1) * In the block editor, I adjusted both the horizontal and vertical block spacing for the core columns block, but it’s taking my custom css because it has !important. So I don’t think adding !important help solve my issue. * Moderator [threadi](https://wordpress.org/support/users/threadi/) * (@threadi) * [3 years, 3 months ago](https://wordpress.org/support/topic/modify-the-initial-gap-value-for-core-columns/#post-16462250) * The solution to your requirement is actually just pure CSS. You could also write * ```wp-block-code body .wp-block-columns.is-layout-flex { column-gap: 1em; } ``` * or * ```wp-block-code body div .wp-block-columns.is-layout-flex { column-gap: 1em; } ``` * The important thing is that your specification has a higher value. * If you want to have this only on a certain block, you can also give it its own CSS class (e.g. “addgap”) and then define it that way via CSS: * ```wp-block-code body .wp-block-columns.is-layout-flex.addgap { column-gap: 1em; } ``` * I also wonder why you added a row-gap. In your question it was only about column- cap – if you set both higher you don’t need a separate CSS specification for it because the identical value could also be set by “gap: 4em”. * Thread Starter [rose18](https://wordpress.org/support/users/rose18/) * (@rose18) * [3 years, 3 months ago](https://wordpress.org/support/topic/modify-the-initial-gap-value-for-core-columns/#post-16462366) * Thanks [@threadi](https://wordpress.org/support/users/threadi/) ! * Actually my main question was how can I change the default gap value, not just the column-gap. For core columns blocks, you can adjust both the horizontal ( column-gap) & vertical (row-gap) blocking spacings. * ![](https://i0.wp.com/snipboard.io/hmU3gf.jpg?ssl=1) * If block spacings are not set, then the default css is this: * ![](https://i0.wp.com/snipboard.io/rUp7tv.jpg?ssl=1) * If only the horizontal spacing is set, then the css is this: * ![](https://i0.wp.com/snipboard.io/ejrLX7.jpg?ssl=1) * ![](https://i0.wp.com/snipboard.io/AL5gbO.jpg?ssl=1) * If only the vertical spacing is set, then the css is this: * ![](https://i0.wp.com/snipboard.io/4m2tBG.jpg?ssl=1) * ![](https://i0.wp.com/snipboard.io/c7MnIr.jpg?ssl=1) * If both the horizontal + vertical spacings are set, then the css is this: * ![](https://i0.wp.com/snipboard.io/l75Qi1.jpg?ssl=1) * You can see that if one of the block spacing is set, the non-set spacing value is 2em. * ```wp-block-code // if horizontal spacing is set .wp-block-columns.wp-container-9 { gap: 2em var(--wp--preset--spacing--small); } ``` * ```wp-block-code // if vertical spacing is set .wp-block-columns.wp-container-9 { gap: var(--wp--preset--spacing--small) 2em; } ``` * I did try to give the property a higher value, but it’s always taking those css if I adjust both the vertical and horizontal spacings, which I don’t want. * Just want to know is there a way to change that 2em default value. * Thanks! - This reply was modified 3 years, 3 months ago by [rose18](https://wordpress.org/support/users/rose18/). * Moderator [threadi](https://wordpress.org/support/users/threadi/) * (@threadi) * [3 years, 3 months ago](https://wordpress.org/support/topic/modify-the-initial-gap-value-for-core-columns/#post-16462456) * > Just want to know is there a way to change that 2em default value. * If by 2em-value you mean the 2nd value at the property, I already told you that above. There is no other way (at the moment). If you want an adaptation to Gutenberg in this respect, write to the Gutenberg developers here: [https://github.com/WordPress/gutenberg/issues](https://github.com/WordPress/gutenberg/issues) Viewing 7 replies - 1 through 7 (of 7 total) The topic ‘Modify the initial gap value for core/columns’ is closed to new replies. ## Tags * [blocks](https://wordpress.org/support/topic-tag/blocks/) * [columns](https://wordpress.org/support/topic-tag/columns/) * In: [Developing with WordPress](https://wordpress.org/support/forum/wp-advanced/) * 7 replies * 2 participants * Last reply from: [threadi](https://wordpress.org/support/users/threadi/) * Last activity: [3 years, 3 months ago](https://wordpress.org/support/topic/modify-the-initial-gap-value-for-core-columns/#post-16462456) * Status: not resolved ## Topics ### Topics with no replies ### Non-support topics ### Resolved topics ### Unresolved topics ### All topics