Custom Type Block shows two wide when choosing three column grid

  • Resolved fatherb

    (@fatherb)


    3 years ago

    Hi

    The Custom Type Block shows two wide in a grid when choosing the three grid option. This happens regardless of what spacing option I choose, ie. none, small, medium, large, etc.

    It appears there is padding added to the grid blocks which mean the columns can’t be 33.3% wide. The problem occurs with all column options chosen ie. selecting 2 columns shows 1 column, selecting 3 columns shows 2 columns, selecting 4 columns show 3 columns.

    Also getting problems with the post template creation. Trying to add colours to text or spacing around blocks gets ignored when displayed in the grid.

    Hopefully, someone can help. Getwid is latest version 1.7.9 and on WordPress 5.9.2.

Viewing 6 replies - 1 through 6 (of 6 total)

  • Hey,
    The issue is that your columns misse the css property box-sizing: border-box.
    Let’s say you choose 3 columns the column width will be 33.33% + padding left and right, so the column width is wrong and only 2 columns can be displayed in a row.
    To solve that you must load a css file for the editor in your functions.php :
    add_editor_style( array('css/css-file-for-editor.css') );

    With the following css:

    *, ::after, ::before {
  box-sizing: border-box
}
    Thread Starter fatherb

    (@fatherb)

    Thanks for the reply.

    I added that CSS to the customizer instead and it repaired the issue.

    So is this a problem with my theme? I can let them know there is an issue with Getwid and GeneratePress if so.

    Or do you have plans to ensure box-sizing is added to the Getwid columns?

    In my case the problem was only present on backend but not on frontend, due to wordpress 5.9.3 + Getwid. (that’s not the only bug which appeared since this wp version).
    I don’t know Generatepress but if you also have that problem on frontend so indeed the theme should embed that css.

    Plugin Support eugenewhite

    (@eugenewhite)

    Hello guys!

    Yes, most likely that this issue is connected to the styles of the theme rather than the Custom Type Block itself. And we are glad that you already sorted this out.

    Thread Starter fatherb

    (@fatherb)

    Thanks for the reply @eugenewhite

    I still think the plugin needs to add the box-sizing issue css to its code natively so that it will work with all themes. Hopefully you’ll do that in an update.

    Plugin Support eugenewhite

    (@eugenewhite)

    Hello @fatherb.

    I would like to inform you that I wasn’t able to reproduce the issue with your theme locally. When I select a grid layout with 3 posts in a row, all 3 of them are in a row on the back end as well as on the front end. So, please, provide steps to replicate the issue so we can escalate it to our developers’ team. Thank you. Also, try disabling plugins that you have installed to make sure that there’s no conflict with one of them.

Viewing 6 replies - 1 through 6 (of 6 total)
  • The topic ‘Custom Type Block shows two wide when choosing three column grid’ is closed to new replies.