IPhone's Safari Page Width Inheritance

How does Safari on the iPhone figure out the default width of a page? Different pages have different widths and all of the sites I go to seem to fill up the screen quite nicely, but there is a problem.
I've visited my personal site on the iPhone which is at the default domain (www.). I've downloaded the iPhoneChat script (http://www.publictivity.com/iPhoneChat/) and uploaded it to a subdomain (aim.). When I visit the subdomain, Safari appears to be remembering the width of my site at www. and applies it to the site at aim.. This means instead of getting the login form nice and big as it should be, it's all zoomed out and tiny with really really wide scrollbars.
I've tried setting the width of the body to 320px, but the iPhone seems to insist on forcing what appears to be an inherited width from the www. site. That causes the login form to take up less than 1/4th of the screen instead of filling it up nicely like it should. Needless to say, as a web developer, this annoys the heck out of me.
What I would like to see is each page being handled on it's own. Figure out the width of THAT page and make it fit, no matter the width of other pages on the same site. Or, at the very least, make a distinction between subdomains.
It would also be nice to be able to set a specific width for a site with dynamic width. That would make it a lot easier to read long pages of text such as the books on http://www.gutenberg.org.

PLEASE don't set it at 320 and not user scalable. The owners of MacTech set it to 320 and you can't see it on portrait at all and have to scroll slightly right to left on landscape to see the page.
I've read Apple's document on this, and while they say 320 should work it really doesn't quite. Perhaps 315?
http://developer.apple.com/iphone/designingcontent.html
and the example page:
http://www.mactech.com/commapplenewsforiphone.php?hours=8
Not sure why Apple said 320, but note that you can't see all of the icons on the side without missing a bit of the text on the right. And the not user scalable thing is annoying as heck.
My two cents, for what they're worth,
Aym

Similar Messages

I have a movie site app banner ad that I cannot delete from my IPhone 5 Safari page. I appears every time I open Safari. Any suggestions.

I have a movie site banner ad that I cannot delete from my IPhone 5 Safari page. It appears every time I open Safari. How can I delete it?

You do not have a virus. Sounds like you are just being bitten by Safari's desire to reopen all windows - and reconnect to all sites that were open in those windows - in Mac OS X 10.7. I believe that if you hold down option (or is it shift?) while opening Safari that it will not try to reload those pages.
Regarding malware, see my Mac Malware Guide:
http://www.reedcorner.net/guides/macvirus
(Note that my pages contain links to other pages that promote my services, and this should not be taken as an endorsement of my services by Apple.)

Varying page widths in Safari.

Would anyone know if they have solved the problem of Safari page widths not being consistent.   When browsing (through newspapers, for example) some pages load the proper size while others (Huffington is one example) are only 2/3rds the page width and with a corded mouse, need the assistance of the blue slider at the bottom.
Recently I bought a Magic Mouse and that brings its own problems   With Huffington I find the page sliding around as the control from the mouse can be rather loose depending on the finger position. Google is often worse with one in three pages needing the blue slider adjustment.
I have yet to find a setting that will tailor web pages to generally match my computer screen size.   Yes, there are exceptions which I accept but have I missed something?

Hi seventy one,
I this this is a page programming issue, not a Safari (nor any other browser) or hardware issue.
I was providing tech content when our firm rolled out its first website about 12 years age. We had I.T. employees who programmed the pages. in testing, I had noticed the pages failed to fill very much of the screen even in the days before widescreen monitors. They said they could have the pages dynamically fill the window width available but that would slow down the page response (understand most people were still on dial-up back them) and require more space on the servers (again, turn back the clock). They preferred low-feature leanness.
Today, those capacity concerns are minor but pages still get programmed poorly. Look at Apple Support Community, provided by a third-party vendor: The content is stuck in the middle even on a wide monitor. Even Apple main pages want to use the "center lane."
Now open Wikipedia--the page and column widths change dynamically as you resize a window until it gets to a point where the layout would go walkabout, then you get the scroll bars.
I think if you will experiment with different web pages you will see my point.

I sent in my iPhone 6 for repair. I used restore on the loaner phone I was given, and the contacts, texts, reminders, and Safari pages all showed up. My phone is back, and when I used the restore function again, those items are missing.

I sent in my iPhone 6 for repair. I used restore on the loaner phone I was given, and the contacts, texts, reminders, and Safari pages all showed up. My phone is back, and when I used the restore function again, those items are missing. I do not use iCloud because I have no wifi at home, limited data available for regularly backing up, and I have a 64GB phone and don't wish to pay to upgrade from the 5GB iCloud storage. Am I doing something wrong? It worked so seamlessly on my loaner phone that I am completely stumped as to why it will not restore those items to my original phone again.

The iphone is designed to be synced to your computer or cloud service. Your contacts should be in whatever program/service you have chosen to sync.
If you have failed to do this, then they are likely gone.

Designing Safari page for iPhone

Note here:
http://www.flickr.com/photos/jorgecorrea/4359779134/lightbox/
iPhone is 480 pixels wide. But when I design an iPhone Safari homepage page that way, it's too narrow. I doesn't look right unless it's 962 pixels wide.
Why not? What is the correct size in pixels of an iPhone screen, and how best to I design an iPhone Safari page?

Hi
you may do better in the Developer or even the iWeb sections - but possibly the iPhone is designed to display regular (much wider than 480) pages w/o scrolling, so defaults to 'squeezing' yours to suit that.

I am unable to add a bookmark to a Safari page on my iPhone 4.

I am unable to add a bookmark to a Safari page on my iPhone 4. The " " does not appear, so that I can do so. Is there a fix?

My apology for the typo. The plus sign "+" was supposed to be in the quotes in the second sentence.

IPhone 4: Safari cannot open the page because your iPhone is not connected to the internet

iPhone 4: Safari cannot open the page because your iPhone is not connected to the internet. Any thoughts? I've trid network reset and hard reset...nothing. Can make calls but no internet, mail or apps work.

do you have cellular data? you should call your phone carrier and ask them.

IPhone 3G, Safari cannot open OWA (Outlook Web Access) to Exchange 2007

Hello, picked up iPhone 3G in hopes of replacing my Windows Mobile 6 phone (AT&T 8525), and first i did was,
a) Installed the my .pfx certificate, appears successful as the certificate showed up under Settings | General | Profile, as identity certificate (although shows up as "Unsigned", not sure why). Verified the details of the certificate and all looks correctly imported, especially the expiration date is correct.
b) Setup Safari to NOT block popup, cleared cache, history and cookies
c) Opened up Safari, and pointed to the following URL,
http://my.company.com/OWA
And i get the "The page cannot be displayed", with Error Code: 401 Unauthorized.
This same .pfx certificate is used successfully in my Windows machine, and using the same OWA URL, using Internet Explorer, Firefox and Safari for Windows.
And my Windows Mobile 6 (AT&T 8525 phone) also using the same .pfx certificate has no problem opening up the login page to the OWA, using the same URL.
Can someone help or verify whether accessing OWA through iPhone 3G Safari using the .pfx certificate is NOT supported at this time?
Thanks much!

When you created the PCKS#12 did you create with the full chain? My first suspicion is "unsigned" - this indicates that the phone can't validate what signed this certificate. You may have to import the signing root seperately as I don't know if the iPhone cert store handles chained certs or not.
Secondly, Safari browser is echoing back the 401 message indicating that the server did not accept your credentials. Many SSL implementations require the client to send the full chain (to the root that signed everything) - it makes no sense when the server should have the root and be able to validate this, but I have run into this before.
Since this has worked on your WinMO device I would try the following:
From a desktop PC access your OMA/OWA server - hopefully you have the PFX installed on a desktop
Click on the SSL lock icon and view the certificate hierarchy
Export the root and any intermediate into .CER file
Import the root and any intermediate CER files into the iPhone
The first thing that you hopefully will see is that the Profile cert will no longer say unsigned. If it does not, try re-importing it (pfx) AFTER you install the root(s).
I know that some of this seems un-necessary, but I have done a lot of PKI stuff over the years, but there seems to be very different implementations in key management.
Hope this helps!

Why does my website on my iphone show outdated pages?

I'm having a strange problem with my iphone5. It's actually happening with my ipads too.
Several pages on my website, but not all pages are displaying an old version of the site page in the browser. It's like some pages (including the home page) is stuck in an old cache of those pages.
I use Wordpress with an Atahualpha theme and am up-to-date on all. I have emptied all caches everywhere including the iphone's Safari data. I've disabled my plugins as a test too, but it's still happening.
Strange thing is that my desktop iMacs display the correct, up-to-date versions of those site pages. It's not my home networking because it happens even when I turn off Wi-Fi.
Can anyone suggest how to troubleshoot this?
Much thanks

FWIW, I have traced this particular problem to Wordpress itself, and the caching plug-in in use. In my case, it is WP SuperCache. I am still investigating the parameters, but this is most definitely the source of the problem.

Safari Page reloading when Open in new tab WHY ???

I am really annoyed as when i am browsing on iphone on safari and open web pages in new pages and when i go back to the previous page it started downloading that page again and this is really frustrating..Plz help..is there any setting i have to make for it so that it will not happen any more...Also when i use Opera browser on iPhone this thing never happen..But since i dont like the interface of Opera so i cant use that ..Help plz..

Most likely it is due to a memory issue. The iPhone automatically clears memory if it is running low and it will clear stored Safari pages. If you have a newer device you may want to clear your multitasking bar, as the "suspended" apps might be using a lot of your memory.
It doesn't happen as frequently with Opera since the webpages are highly compressed and take up less memory.

Cannot adjust page width to fit to screen size on some PCs with IE

Hello friends, I am using APEX 4.0 and IE9 on different Windows 7 PCs . The page will go way off the screen to the right on one PC, and fits nicely inside the screen on another PC. This problem does not occur in Firefox on any PC. I have used Firebug to try to isolate the template or css settings. Using Theme_4, I have a breadcrumb region and 4 reports regions. One of the reports regions is in column 1 and 3 regions are in column 2. Display point is Page Template Body (3. Items above region content) for all the reports regions. The CSS is #themes/theme_4/css/theme_4_0.css. The template is One Level Tabs (Right Sidebar/Table Based). I tried various width="" using px and % under Edit Page Template-Definition-Body (see below). I tried style="width:800px" within the <div> tags. I have tried various other changes to theme_4_0.css and apex_4_0.css with no visible change to the page width on the obstinate PCs. I reset IE setting and deleted all personal settings on both PCs with no changes to either one, one fits on the screen and the other does not. The issue is that most of our users use IE so most of them will have to live with using the horizontal scroll bar to see the regions in column 2, unless we switch them all to Firefox (not a bad option, except that option works for our users only, we have no control over external browsers). I have tried suggestions from many discussion threads, as this problem has bothered us for quite some time. I know this is an IE problem, but any help is appreciated. Thank you.
"|" represents screen size and "-" is the regions/content for the "bad" PCs.
|----------|----------
The "good" PCs look like this:
|----------|
Peter
<div id="body">
<table class="tbl-body" cellspacing="0" cellpadding="0" border="0" summary="">
<tbody>
<tr>
<td class="tbl-main" width="100%">#REGION_POSITION_02##BOX_BODY#</td>
<td class="tbl-sidebar">#REGION_POSITION_03#</td>
</tr>
</tbody>
</table>
</div>

BD...
I think your concerns are very reasonable. But I want to sort of refocus things a little bit for you here... it's not really a PC vs Mac issue... Rather, it's specifically an Internet Explorer issue. And you might say that this is synonymous...still 98% of the world uses IE, and you would be correct. Hopefully when the final version of IE7 comes out, it will finally embrace some of the modern day OPEN web standards without trying to make too many standards of its own (this is Microsoft, though).
Anyways, in the meantime, I guess we all try to make the best of it. It's very easy to conclude that iWeb is not a viable tool for you, as long as you have something else to "fall back" on. With my limited knowledge of all things HTML, I have no such luxury. Instead, I have put up a notice on my site for IE users only that the site might not look its best on IE....this notice also encourages IE users to use FireFox, which is very much like Safari and will in 99% of cases display your iWeb pages just like you expect. You can see how I've done this here (but you have to surf from IE)... http://blog.dirtdoog.com
I think many people in the PC world understand the limitations of IE. Certainly many don't, but you have to consider your likely audience, I guess. I believe that your website content is king. If your content is compelling enough to your intended audience, they will jump through hoops to see it in its full glory....but you have to make them aware of the problem. That's why I have chosen to take the path that I have taken.
Let me know what you think.

Flickering of safari pages

When I have multiple safari pages open on my iPhone 5s and try to open one (bring one to the front for using) the specific page while opening it does a flickering on the sites of the page, anyone has the same issue/problem? How to resolve it? A software issue? Not really disturbing but still an issue, is it only on pages that don't have mobile site?

I have this problem too... in fact I got my device replaced due to this problem since Apple couldnt resolve it and the replacement piece has the same problem and another one as well.
Its extremely annoying.

Safari content width (NOT window width!)

Okay, so that none of you are confused: I know how to make my Safari browser window as wide as my screen, and I do it for my own reasons. I like it that way.
This is not a philosophical question: How do I make the content match the width of the window?
For reference: On the PC at work, when I open the New York Times it fills the whole screen, soup to nuts. On my Mac at home, when I open the New York Times it only fills about half the width of the page, leaving a sea of white unused browser to the left and right of the content. I hate having the computer up to my face to be able to read it, and I feel that if the width of the page were to fill the screen it would not be an issue; it isn't at work.
Since I can't find the answer via google, I'm hoping I can get some help here. Remember, I just want the website to match the width of my screen. I know that some websites automatically do this. Basically I just want to zoom.

David Lewis15 wrote:
For reference: On the PC at work, when I open the New York Times it fills the whole screen, soup to nuts. On my Mac at home, when I open the New York Times it only fills about half the width of the page, leaving a sea of white unused browser to the left and right of the content.
It sounds like your PC's monitor at work is smaller and/or has a lower screen resolution (i.e. renders objects and text larger) than your Mac's screen.
I opened your first New York Times link in *Windows Internet Explorer* with the window at my full screen width and this is how it looks:
And this is the same page in *Safari on my Mac*, also with the window at my full screen width, same size screen and same screen resolution:
They look the same, taking up the same amount of page width.
It's not Safari that is rendering things differently than on your PC. I'm almost certain it's that your screen on your PC is a very different size or has very different resolution settings. If so, the actual width in pixels of the window you have open on your PC is much smaller than the width in pixels of the window on your Mac, essentially allowing just that central portion of the page to be visible in your PC's browser window.
On your PC at work, go to the control panel and check the settings in Appearance and Themes, Change the Screen Resolution. What does it say the current screen resolution is? (e.g. 800 by 600 pixels, 1024 by 640 pixels, etc.) Then on your Mac check System Preferences, Displays, in the Display section, and check the resolution setting there. If the Mac's screen resolution is much higher (larger numbers) that explains the difference you're seeing. You' have more pixels to work with on the Mac, so you're seeing more of the web page.
I hate having the computer up to my face to be able to read it, and I feel that if the width of the page were to fill the screen it would not be an issue; it isn't at work.
It sounds like you might be having problems that are not related to the layout of web pages as much as with the size of text and other page elements on your Mac as opposed to your PC? If that's the situation, there are several things you can do to make things easier to read on your Mac. Let me know if that's the problem and I'll go further with that thought.
Message was edited by: Rachel R

Windows7-how to increase page width & reduce font size

Compared to internet explorer, viewing each page on Firefox is difficult. Titles and images are overlapping and limited page width leaves blank columns on both sides, resulting in overlapping vertical text on the right side. Is there a way to 'Landscape' every page and also how do I reduce font size

See
how to increase the font size in outlook mail on iphone 4s and ios 6.0.1 operating system?

Why is Safari page black? The only thing on the page is time and battery.

Why is Safari page completely black? The only info is time and battery and signal.

Try resetting your iPhone by pressing the home and sleep buttons until you see the Apple logo, ignoring the slider. Takes about 5-15 secs of button holding and you won't lose any data or settings.

IPhone's Safari Page Width Inheritance

Similar Messages

Maybe you are looking for