[Resolved] GP 3.0 IPad Sidebar Width (Update)

[Bob]

Hi there

I have found one more issue with the righthand nav issue – when on landscape view on an iPad, the footers are still not aligning inline but are stacked. I am guessing it’s one more wee piece of code?

Regards,

[Tom]

How many footers do you have set? On tablets, they’re split into 2 – if there’s an extra, it’s set to show up 100% of the width to fill the area out.

[Bob]

I have three set, but all three are stacked. On my other site, which I didn’t update, I have 4 and they all align OK as per desktop. I’ll go back to the previous version for now I think.

Best,

[Tom]

They shouldn’t be stacked unless you’re using portrait mode on your tablet or using your phone.

I’m sure whatever it is can be fixed with a small CSS tweak – better that than being stuck with an old version.

Let me know 🙂

[Bob]

Hi Tom

It’s been a while and I finally updated my second site – but the (4) footers on the ipad in landscape mode are still stacked. Could you give me the CSS to fix? – I worked on this for a while, but couldn’t get it to how I wanted it (ie in landscape mode having all the footers side by side.

Best,

[Tom]

Landscape mode has the footer widgets stacked? It shouldn’t, landscape mode takes on the same layout as the desktop site.

[Bob]

Sure, but they are stacking – inlexio.com is the site. Would this Custom CSS below be causing issues, perhaps?

.footer-widgets {
      font-size: 15px;
      line-height: 19px;
      margin: 0 0 0 0px;
	 /*padding: 0px;*/
}

.inside-footer-widgets .inner-padding {
	padding: 0px 15px 0px 15px;
}

[Tom]

Are you by chance using a custom footer.php file in your child theme? You’re using the latest version of GP, but you’re missing some classes which have been added to the footer widgets.

You can try this CSS:

@media (min-width: 1024px) {
    .inside-footer-widgets .grid-25 {
        float: left;
        width: 25%;
    }
}

[Bob]

Thanks – not that I remember… but I do have a footer.php in the child theme (which I guess I must have put there!), so I pasted the latest parent footer.php to the child theme – and now I get two rows (with and without the new CSS).

So my bad I think – sorry! I’m OK with 2 stacks, so I think I can save you any more hassle on this and move along… (I’ll delete the child footer.php so I get future updates)

Thanks again.

Best

[Tom]

Awesome – glad that was it!

Two columns definitely looks quite a bit better on tablets 🙂

[Author]

Posts