-
When I drag multiple containers of the same global style into a grid, the calculation of the item width becomes dysfunctional. (Width is a defined attribute on my child-container global style).
It seems the gb-grid-column is failing to reflect the width inherited from the global style.
Is there a solution or suggested workaround for this?
-
Hi there,
In what way does it become dysfunctional? Can you share a link to where we can see this issue on your site?
We’ll assess the situation and advise afterward.
-
I’ve found another workaround, but I do want to get you reporting so you can look at the bug. What happens in this case. The dysfunction that emerged in this scenario is that the width of the grid’s child containers is not being governed by the global style.
The “grid’s” inner
<div>, apparently created by the “grid” scripting engine, with the class .gb-grid-column-[container’s global style’s suffix] is itself gettingwidth:unset;This is perhaps coming from the styling of the first-child’s last listed class, rather than the computed CSS attributes of the element. This theory is supported by the fact that setting a width on the containers sets the gb-grid-column to that width, and strangely leaves the container scaled relative to the gb-grid-column.My thinking here is that the magic of global styles is not playing nicely with that of gb’s “grid”
This should be reproducible easily enough. Just make a global style for a container with a set width, say 25%. Then, on a page, create a few of those containers. Then, create grid. Drag these containers into the grid in outline view to replace the original container(s). It looks fine in the editor, but breaks in the front end.
(checked safari and firefox) -
I see. Thank you for clarifying.
The Global style width of the Container Block takes effect into
gb-containeras opposed togb-grid-columnwhich causes the issue.You need to create an actual GB Grid Block in your Global style page and set the column of this Grid as the Global style. This is what would work.
Another approach here to avoid the issue with what you currently have is to use a Container Block that’s set to display
flexas opposed to a Grid Block.
- You must be logged in to reply to this topic.