NO BUG: Nestable tabs + grid not correct in builder - correct front-end

[MarketingSpectrum]

Bricks Version: 1.6.2
Browser: Chrome
OS: Windows

Something odd is going on with Grid. It’s correct on desktop & tablet, but on mobile (landscape+portrait) the second block is displaying NEXT to the grid block.

On an actual phone it’s displaying correctly:

If I change it in the builder to ‘no wrap’ it displays correct in the builder.

But either way it displays correct on the front end?

[timmse]

Hi Michael,
Thanks for your report!

To be able to reproduce the problem 1:1, it would be helpful to know the grid settings. If you export the template and the corresponding class styles, I can reproduce the problem even faster

Best regards,
timmse

[MarketingSpectrum]

Hi Timmse,

uhh little help?
If I select the section, export it as template → will you get the classes too?

Happy to it for you, but…

Just because it might be even faster - it’s on the same site as our last convo about GF.
So feel free to login to export it as you wish.

[cmstew]

Hey Michael,

I don’t think so. But I just saw a little explainer on how to export classes yesterday.

NO BUG: Global Styles & CSS Classes are not exported when using WordPress Tools > Export function

Hey Dustin, you can export or import classes and styles While in the class list, there is a little ex-/import icon that allows you to ex- or import your classes: [CleanShot 2023-02-08 at 15.20.50@2x] Basically, I agree that it would certainly be easier if everything could be exported together with just one click - but let’s wait and see, maybe your request will end up on the Idea Board. If you still have issues with it, please create a new report, since this one is about the Wor…

[timmse]

Hey Michael,
I exported the template and the styles and found a new problem with CSS Grid during the import that needs further investigation. I’ll get back to you early in the week. Have a nice weekend!

[timmse]

@MarketingSpectrum

Something odd is going on with Grid.

Yes, it was your settings You gave the content block under the image a height of 100% (presumably to compensate for possible differences in text length), which caused it to break at a certain point. I have accordingly removed the height and all stretch settings, which should be superfluous.

I cannot explain 100% why Flexbox does this… However, this is not a bug, as I was able to reproduce the problem 1:1 with pure CSS.

Best regards,
timmse

[MarketingSpectrum]

Hi Timmse,

that had a reason - indeed to keep the box & buttons equal height on scaling.
Inside the builder you can’t simulate it since the scale no longer works.

But just before the tablet mode things looked bad.
So therefor I added a 100% height to both the block beneath the image as the grid card itself.
(redid this and set the card to no-wrap.)

Seems to work well on all devices + I keep the height equal everywhere now.

Funny thing though, thanks for looking into it!