This is an archived snapshot of W3C's public bugzilla bug tracker, decommissioned in April 2019. Please see the home page for more details.

Bug 19356 - in Safari on iPhone, blog paragraphs are in a skinny column on the left
Summary: in Safari on iPhone, blog paragraphs are in a skinny column on the left
Status: CLOSED FIXED
Alias: None
Product: webplatform.org
Classification: Unclassified
Component: skin (show other bugs)
Version: unspecified
Hardware: Other other
: P2 major
Target Milestone: ---
Assignee: Lea Verou
QA Contact: public-webplatform-bugs list
URL:
Whiteboard:
Keywords:
Depends on:
Blocks:
 
Reported: 2012-10-08 18:09 UTC by Vicki Murley
Modified: 2012-10-12 00:32 UTC (History)
2 users (show)

See Also:


Attachments
A screenshot of a blog post in Safari on iOS 6 on iPhone (156.05 KB, image/png)
2012-10-08 18:09 UTC, Vicki Murley
Details

Description Vicki Murley 2012-10-08 18:09:45 UTC
Created attachment 1209 [details]
A screenshot of a blog post in Safari on iOS 6 on iPhone

The front page and the blog pages of webplatform.org look bad on iPhone.  
On the blog pages specifically, such as http://blog.webplatform.org/2012/10/one-small-step/, the paragraphs of the blog post are in a narrow column down the left side of the page.

Screenshot attached.  I'm using Safari on iOS 6 on an iPhone 4S.
Comment 1 Vicki Murley 2012-10-08 18:15:29 UTC
I see that the viewport content is set to "width=device-width", meaning that the viewport width will be 320px on iPhone.  Most of the divs on this page have a max width of 320px (or they are percentages), so theoretically everything should fit just right.  

However!  There is one style that is hard-coded to a width of 932px:


@media screen
#mw-head .container {
padding-right: 18px;
width: 932px;
}

Although there are other minor style corrections to be made here, this 932px wide div looks to be the primary source of the "skinny column of paragraphs down the left hand side" problem.
Comment 2 Lea Verou 2012-10-10 21:20:45 UTC
Fixed with the other mobile fixes it seems. Please open a new bug report if you find more mobile issues, ideally one separate bug report per issue.
Also, screenshots are generally helpful :)
Comment 3 Vicki Murley 2012-10-10 23:17:18 UTC
Thanks Lea!  If I see any new issues, I'll file a separate bug.

(FWIW, I did include a screenshot with this bug report)
Comment 4 Lea Verou 2012-10-10 23:18:52 UTC
(In reply to comment #3)
> (FWIW, I did include a screenshot with this bug report)

Apologies on the screenshot bit; I was tired and I missed it.