Geek asks and answers

The width of the footer is set to 100%, the absolute position does not apply to the right edge of the browser window in mobile safari

good morning, o mighty stack.

we are working on a site created in Wordpress using the genesis theme framework.

here, http://foodtrucksnashville.com

Everything is fine and dandy in Chrome, Opera, FF and IE (close enough) until you look at it in Mobile Safari on iPhone and iPad

# footer-wrapper (bottom, with clouds and a blue background of the strip) - width: 100% position: absolute; bottom: 0; but, alas, it does not extend to the browser window itself.

I read a little that the mobile safari is suffocating from a position: fixed, but could not find anything that would be useful for me here. Hence the new Stack_Query.

Thanks again, stack.

have a good one.

ps I would like to avoid using JavaScript to solve this problem (you know, get the width of the viewport with jQuery and automatically assign this value to # footer-wrapper), but if it says Stack, then SO BE IT.

+3
source share
1 answer

To prevent dangerous sorting of the viewport, you can configure it. To achieve this, use tags <meta>.

<meta name="viewport" content="width=device-width" />makes the viewport maximally expanded on the device. I have a footer 100% wide on a mobile site, no problem with this code.

Read Apple's official documentation on this topic for more information.

+3
source

More articles:


All Articles