SitePoint Sponsor

User Tag List

Results 1 to 3 of 3

Hybrid View

  1. #1
    SitePoint Member
    Join Date
    Nov 2013
    Posts
    2
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Trying to master RWD: why does iPhone render a page in full web mode/tiny print?

    I'm having a problem (very beginner-type problem).

    I have a section of my site that is pretty basic HTML markup. Page widths are given as 100%; it is not a fixed width page. In a web browser the page narrows down as it should when the width of the browser is narrowed. But in an iPhone, the page presents as an ordinary wide-screen browser page! That is, wide layout with minuscule font.

    What I don't understand is, why does the font not present in an appropriate size for the device? Why don't line lengths get shorter and wrap around appropriately for a narrow screen? I haven't seen any advice anywhere to the effect that iPhone has to be _forced_ to narrow down the page to make it readable without zooming in. I'm sure I'm missing something extremely basic here but I can't figure out what it is.

    Does anyone have any clues?

  2. #2
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    40,369
    Mentioned
    180 Post(s)
    Tagged
    6 Thread(s)
    Hi,

    Without a viewport meta tag in the head of the page mobile devices will assume a page is a standard 980px width page and shrink 980px of it to fit the mobile screen resulting in small text (even for fluid pages).

    You need to add this meta tag into the head of the page to explicitly tell the mobile device not to shrink it.

    Code:
    <meta name="viewport" content="width=device-width, initial-scale=1.0"/>

  3. #3
    SitePoint Member
    Join Date
    Nov 2013
    Posts
    2
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thank you!!! It worked beautifully.

    This is the kind of really silly basic error that can cause hours or days of frustration. You saved my sanity!

    Bathrobe


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •