Responsive Column Issue on Corporate Pro theme

[jhg]

Okay guys and gals,
I have a strange issue going on with columns in the Corporate Pro theme when viewed on my Ipad. (The issue can also be seen on a desktop browser when resized to the smaller tablet size width.)

I have the original style sheet uploaded, so it appears that it might be an issue with the theme itself?

Here is a screen capture from my Ipad - https://scotfixespcs.com/website/wp-content/uploads/IMG_0536.png

You can see that it bumps the second column down to the next line and the left margin causes the indent. Ideally, I think these columns should go to full width on the tablet.

I have tried several times to set up a modification in the media queries to remove the indent and spread each column out to full width- but have had no success.

I'm hoping someone can help me out here. I'm stumped.

https://scotfixespcs.com/website/services/

[Victor Font]

It's not the theme causing this. It looks like you're using blocks, either from Gutenberg or a block plugin, and there is no media query CSS included with the block. You have to create your own class. The original CSS controlling the width is:

.wp-block-column {
    flex-basis: 50%;
    flex-grow: 0;
}

You need to alter this for the media query.

---

Regards,

Victor
https://victorfont.com/
Call us toll free: 844-VIC-FONT (842-3668)
Have you requested your free website audit yet?

[jhg]

I'm using Gutenberg. It's my first time building a new site with the new editor. I had actually added that class earlier for the block and it wasn't working for me. Obviously I was doing something wrong.

Gave it another go and it's working now.

Many thanks to you sir!

[Author]

Posts