[Support request] Grid Container height in GB 1.7

Home Forums Support [Support request] Grid Container height in GB 1.7

Home Forums Support Grid Container height in GB 1.7

Viewing 15 posts - 1 through 15 (of 17 total)
  • Author
  • #2550946

    Hi there,

    I’m having trouble inserting a grid block the way I was used to from GB 1.6.

    Grid-Container in GB 1.6 automatically had the same height as its neighbor container (like in a table):

    With 1.7 this has unfortunately changed:

    I don’t know how to set it back to the way it was before πŸ™

    Thanks for help!

    Customer Support

    Hi there,

    select the grid item Container Block, and in Sizing set its Height to 100%


    Thank you, David!

    I wonder why this default setting is no longer present in 1.7.
    But I’m sure there will be good reasons for that πŸ˜‰

    Thanks again!!

    Customer Support

    Pre 1.7 we added CSS behind the scenes to apply the height: 100% to all Grid Item Containers ( if the Grid Block had a default vertical alignment ).
    There was no editor control to change that. And in a lot of instances that was OK.

    In 1.7 we exposed much of the hidden CSS in new settings. So some of the older “shortcut” methods don’t apply anymore – and this is the case with the Grid Block, as that now needs an update to embrace those changes.

    Question is – should we add back a shortcut option in the grid for same height columns ? ( which would just add the 100% height to them ). Your thoughts are appreciated πŸ™‚


    Question is – should we add back a shortcut option in the grid for same height columns ?

    If you ask me: yes, I would welcome that! Because I think that the setting in Sizing > Height > 100% is not self-explanatory (especially since you first have to change the unit of measurement for height, because there PX is preset).

    I also find the setting for the icons quite cumbersome now in 1.7.

    In 1.6 there were two dropdowns:
    Icon position: inline / above
    Icon alignment: top/center/bottom

    Now in 1.7, when you add an icon to a headline, the icon sits inline / center.
    And it’s not obvious how to change the icon position or alignment. I’ve figured that out by now, but I think a shortcut (in the Icon area) would be useful here.

    But anyway, GB is awesome !! πŸ™‚

    Customer Support

    That’s great, thanks for the feedback and kind words πŸ™‚


    Hello David

    You say…
    “Your thoughts are appreciated”

    Here are mine.

    I absolutely love GeneratePress and GenerateBlocks, but…

    The upgrade to 1.7 is the first time I’ve thought “what on earth have they done!”

    For instance, you tell us equal height columns settings no longer apply, but in the grid settings, below vertical alignment, is still says equal height columns are default.

    As mentioned above the headline icon is now positioned via the row and column arrow button.

    Is it possible for a member of staff to list all of these changes that affect every user.

    At the moment every single user will have to spend hours trying to figure out what has changed and then working out how to do things the new way.

    I looked this morning (5 March) and some documentation has been updated today.

    But this update has made it so that I can’t do many of the things I could do before.

    I’m also worried that sites I’ve built in the past might need manually repairing if things like equal height columns break.

    I remain a great big fan of GeneratePress and GenerateBlocks, but I’d be lying if I said I wasn’t worried about the impact this change is having on thousands of users just like me.

    Not to mention the people who end up owning and running the sites we build for them.

    Best wishes for the future of this fantastic product.

    Customer Support

    Hi Philip,

    thanks for taking the time to provide detailed feedback.

    First off, just to re-assure you, any legacy block content will continue to behave exactly as it did before. So by simply updating the plugins on a site won’t change existing blocks.

    If you choose to convert legacy containers to the new system then yes these changes will take affect.

    Secondly and as importantly, we are sorry to hear of the worry and frustration these changes have caused.
    IT was a super complex update that we knew would entail “breaking some eggs” in the first instance. We now push ahead and will be releasing updates to put back some of the quality of life features we had to remove.

    But everything you could do previously with the plugin is still possible ( and more ). Let me know which things you need assistance with


    Hello David

    Things that are confusing me at the moment mainly revolve around the sizing box.

    1. When should I use the sizing settings and when can I ignore them.
    2. What effect do the different sizing settings have.
    3. How do I prevent content breaking out of the container. Eg: using min height instead of height.
    4. Why are there two grid building options, the grid block and containers set to flex.
    5. When should I use the grid block and when should I build the grid from containers using the flex options.

    Another concern I have is that sometimes I build websites for non-techies who then add blog posts to their site after it’s finished. If I’m struggling it’s possible they’ll struggle too, which doesn’t make happy customers.

    What I’d really like is a few tutorials saying…

    • This is what’s changed.
    • These are the circumstances when you’ll use the new settings.
    • And this is how to do the most common tasks with the settings.

    I’m sure I’ll love the new settings once I’ve figured it all out. But in the meantime, I’m confused.


    Customer Support

    OK, so:

    1. Unless you want to build more complex layouts then in most instances the sizing options you require are the same as legacy versions of GB, except now all sizes are found under the Sizing panel.
    I drew quick table for comparison:


    2. Leo and Ying added a specific doc for sizing options here:


    the main thing with sizing is choosing the right type of `units:
    Fixed units eg. px em vs responsive units eg. % vw.

    In most cases use responsive units as those will work into any size of container or screen size.

    Fixed units should be used primarily for max-width and min-height to avoid breaking containment.

    But they can be used for max-height if you want to create:
    a) decorative piece say just a background to a container.
    b) a vertical scroll box by using the Layout > Overflow options

    And they can be used for width and min-width to:
    a) create fixed size items that sit inside a horizontal scrollable container.
    b) to create a fixed aspect ratio elements such as an icon button or avatar image that will always be smaller than their parent container or screen size.

    There are of course many other use cases for sizing that would be hard for me to document here.
    Have a read of the doc for more info.

    3. Does #2 cover this?

    4. Grid Block does a lot of the heavy lifting for flex box layouts.
    As it adds an additional wrapper that means you can set 4 columns of 25% width for example, add 20px of grid gap and use margins on those grid items … and it just works.
    Try that with Flex box and you realise it takes a LOT more work.

    5. So for most designs continue to use the Grid Block, unless there is something you just can’t achieve with it.
    A good instance where to use a flex container is building your post meta, where sizing may need a variety of unit types or the use of flex properties.
    Expect to see some flex layouts in updated patterns and GP Sites son.

    Does that help for now ?


    Thanks David, for providing such a comprehensive answer.

    There’s a lot of info here and it’ll take a while to digest it all. But it defiantly takes me much closer than I was before.

    And yes, that does help a lot.

    Once the new patterns come out (I’ve got GB Pro) I’ll be able to deconstruct them and see how they’re put together.

    I can see the benefit of the flex options, when I’ve got over the learning curve πŸ™‚

    Customer Support

    You’re welcome.
    Let us know how you get on


    Hello David, this is how I got on…

    There were two things in the 1.6 to 1.7 update that concerned me.

    • Equal height columns were no longer default.
    • Headline icon position had a new setting.

    Had I found a clear statement saying…

    • add 100% to column height
    • and change the icon position using the row, column and reverse buttons

    I probably would not have delved any further.

    However, I live in England and from north to south, we all got snowed in this weekend.

    So I decided to take a self paced Flexbox course via SitePoint, which I already had a subscription for.

    I spent Saturday morning taking the course, then Saturday afternoon playing a game called Flexbox Froggy.


    “A game where you help Froggy and friends by writing CSS code!”

    I can now take much better advantage of the new settings. And although I didn’t want to take yet another course, I’m glad I did. GeneratePress is my go-to theme and understanding Flexbox is defiantly a useful long term skill.

    My advice for other users…
    If you use GenerateBlocks regularly and you’ve already got a good idea of how CSS works, it’s well worth learning Flexbox.

    If you don’t want to learn about code, just get used to adding 100% height for columns and experiment with the headline icon using the row, column, and arrow buttons.

    Customer Support

    Hi Philip,

    thanks for the invaluable feedback.
    I was fortunate enough to have avoided the snow. But it sounds like you made good use of the time. Flexbox froggy is great fun too πŸ™‚

    We will be taking all these points and those raised by others, to see how we can implement some smart solutions for these everyday actions.

    Thanks again


    Just want to say I feel the same “frustration” like the others in this thread. I too find it hard, for the first time, to intuitive understand how to use new possibilities in GP. I regret updating already, I usually wait for a while, but as I understand if I am patience you will make some things a bit easier again (?). (But I am in the middle of re-designing my site.)

    When I add a new container I see under Layout: Display a lot of alternatives and none of them speaks clearly to me… (Block, Inline Block, Flex, inline Flex, inline… I have no idea! So of course I go with Standard, but when should I/do i have to choose any of the others?)
    And Position is the same, when/why do I choose “relative”?
    Overflow and Flex I have now printed out the document explanation so I can keep it next to my computer, after some time I guess I will learn them.

    Good change for very advanced users, but for mediate, well I was happy the way it used to be… but probably I will love this too later on.

Viewing 15 posts - 1 through 15 (of 17 total)
  • The topic ‘Grid Container height in GB 1.7’ is closed to new replies.