[Resolved] css breaking on tablet size

[Chris]

Hi,

I’m laying out a really simple design using GP, just the basic theme and GB.

I’ve got it pretty much the way I want it, but on my archive pages, the css breaks weird at the tablet size.

I have not added any css that is specific to screen size.

Try this page, https://rev.press/topic/news/ and narrow your browser from desktop down to smartphone. You’ll see in the middle how it breaks at tablet size.

Any thoughts on how to correct this?

Thanks,

Chris

[Fernando]

Hi Chris,

It seems that on Tablet, you’ve set the Grid Column size of your Content Template to just 40%. This is what causes the issue.

Try setting it to 100%. Example: https://share.getcloudapp.com/rRuQr5yx

Moreover, with you’re current structure, you don’t actually need the Grid Block. It just adds unnecessary markup. Are you planning to add more columns in the future? If not, you can just remove it, and have just one Container Block holding everything in place.

[Chris]

Ah, thank you, sorry, I should have caught that. I find GP a bit mind boggling when I dig into it 🙂

Cleaned up the code too, thanks for that as well,

Chris

[Fernando]

I see. You’re welcome Chris! 🙂

[Author]

Posts