[Pro] Website not centering on iOS devices?

I have this website set to center on a page, but for some reason when it’s viewed on an iPhone or iPad it tends to left justify, especially when switching either device to landscape viewing.

I’ve racked my brain trying to figure this out, but I can’t find the solution. Any help is very much appreciated.


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Okay, let me throw some stuff out there - see if any of it sticks.

There are a few contributing factors, but I think you’ll find the problem
manifests somewhere in the menu - maybe the submenu for the last menu item
(Resources). Since it pops out to the right, it reserves that space - maybe?

I’m not sure what the solution is, just that when I delete the menu (or
remove the float) it fits the page.

You’ve a fixed-width of 960px - which is wider than the 768px width of
iPads in portrait orientation, so it can only scale as a whole page. So
max-width to describe the #PageDiv page width doesn’t really make sense.
Also, device-width in the Mobile setup I think might work better.

Also, Kelly - why are you using 4px height divs in the #section-slider ?
Why not trash those extra elements and style the top and bottom border of
#section-slider instead?

Best of luck working this out.


Ernie Simpson

On Mon, Sep 29, 2014 at 2:53 PM, RavenManiac email@hidden wrote:

I have this website set to center on a page, but for some reason when it’s
viewed on an iPhone or iPad it tends to left justify, especially when
switching either device to landscape viewing.

I’ve racked my brain trying to figure this out, but I can’t find the
solution. Any help is very much appreciated.

http://www.williamsburgmemorialpark.com


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

manifests somewhere in the menu - maybe the submenu for the last menu item
(Resources). Since it pops out to the right, it reserves that space - maybe?

Well investigated, Ernie. Just tried adding a margin-right to the navigation and it “centered” the page. So I think it’s indeed the drop down causing this small gap to the right.

Cheers

Thomas


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Well investigated

Quick and dirty - I opened your page in Safari, then opened iOS Simulator
and it’s browser, then in desktop Safari used the developer menu to Inspect
the iOS page.

Tricky, as the new Xcode seems buggy (reported in another thread) however
the iOS 8 devices menu seem to work fine for me.

Since your page code is nicely streamlined, I tried selecting divisions
just to see which highlights ‘pushed out’. Not finding any, I started
deleting divisions to see if I could narrow the issue that way - of course
checking anything that seemed obvious like element widths or page scaling.
When I deleted the menu, the page righted - and then it became obvious when
making the hover state of the submenus visible.

Anyway, that was the investigation.

Sorry I couldn’t spend more time finding a specific solution, but it sounds
like you’re on your way there already.


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Hey guys, sorry for the delay in getting back to you.

Wow, I really the time and effort you both have put into this. Good catch on the submenu thing. Sometimes it’s the simplest things that make you crazy. I’ll update the submenu so it flows to the left and see if that fixes the problem.

Thanks again. :slight_smile:


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Ernie, you were absolutely right. I just tried the fix on my development server and it worked perfectly. Aesthetically, I don’t like the submenu flying out to the left, but if it fixes this issue, I’m fine with it. Thanks again for the assist.

I hope you and Thomas are doing well. :slight_smile:


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

On 29 Sep 2014, 9:07 pm, The Big Erns wrote:

Also, Kelly - why are you using 4px height divs in the #section-slider ?
Why not trash those extra elements and style the top and bottom border of
#section-slider instead?

Hey Ernie, this makes a lot of sense, but I can’t remember the code and process needed to add a top and bottom border. Can you help?


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Also, Kelly - why are you using 4px height divs in the #section-slider ?
Why not trash those extra elements and style the top and bottom border of
#section-slider instead?

Hey Ernie, this makes a lot of sense, but I can’t remember the code and
process needed to add a top and bottom border. Can you help?

After you delete the two divs, select the box named “section-slider” then
go to the Item Appearance tab of the Inspector… under the Border section
click the Custom button and, the rest will become obvious.


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

On 30 Sep 2014, 4:20 pm, The Big Erns wrote:

After you delete the two divs, select the box named “section-slider” then
go to the Item Appearance tab of the Inspector… under the Border section
click the Custom button and, the rest will become obvious.

Sometimes I forget how easy Freeway Pro is. :slight_smile: Thanks for the help.


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

In an application that is as much or more used with third party actions or
user extension with custom code, it’s understandable to look last at
built-in functionality.


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options