Css causing mobile device checkout problems

marcogolfo

Hi

It's been recommended I contact you.

I've had problems with customers ordering prints on my website. Engineers found out that I have some CSS that is causing the trouble with the shopping cart.

Mycustom footer is causing this. More specifically they think the width in this CSS:
.footer-menu-icon-area {
width: 939px;
height: 76px;
margin: 0px auto;
}

That width doesn’t resize for mobile like the rest of his site does, causing the page to appear wider to iOS Safari. Chrome on iOS and the browsers on Android appear to handle this correctly.

Can someone help me sort it out please?
Thank you
Mark

www.markbattistaphotography.co.uk

thenickdude

Try changing the CSS that explicitly sets the width in your footer to use max-width: instead of width:. That should allow it to shrink when the window is skinny.

marcogolfo

Tried changing it and everything's gone wrong on the site the menu header now goes transparent when you scroll down and all of the text seems to have changed I put it back to how it was but no joy - uh oh, really need help

marcogolfo

I give up, it looks like it's reset all the text settings and I can't remember what text I used

Allen

marcogolfo wrote: »

I give up, it looks like it's reset all the text settings and I can't remember what text I used

Looks like you found the problem in another thread with theme changing.

marcogolfo

Yeah, thanks. My checkout still doesn't work on a mobile though

denisegoldberg

marcogolfo wrote: »

Yeah, thanks. My checkout still doesn't work on a mobile though

Have you tried removing the custom footer to verify that it is the cause of the problem?

--- Denise

marcogolfo

Managed to remove it and it didn't make any difference