Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 6 of 6
  1. #1
    New to the CF scene
    Join Date
    Jun 2011
    Posts
    5
    Thanks
    0
    Thanked 0 Times in 0 Posts

    [mobile] Scale to device width not working

    Hello all. I hope you can help me with the following problem with the mobile version of http://thekind.tk, my band's website.

    (direct link for desktops)

    As you can probably see, the website isn't that big but on my ipod 4G it appears zoomed out. Of course the first thing I tried was putting this line between my <head>:
    Code:
    <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
    But somehow this doesn't do anything for me. Even if I play with the parameters such as putting the scale at 2 or 3, the whole meta thing doesn't seem to affect my site's viewport at all.

    Any ideas on how to solve this?
    Last edited by kikibu; 06-28-2011 at 01:10 AM.

  • #2
    New Coder
    Join Date
    Jun 2010
    Posts
    37
    Thanks
    4
    Thanked 0 Times in 0 Posts
    Try this:

    <meta name="viewport" content="width=device-width; minimum-scale=1.0; maximum-scale=1.0" />

  • #3
    New to the CF scene
    Join Date
    Jun 2011
    Posts
    5
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Thanks. I tried a lot of combinations including your suggestion, which is actually in the current version online.

    Somehow the <meta> line doesn't do anything for my site. I use it right here:
    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta name="viewport" content="width=device-width; minimum-scale=1.0; maximum-scale=1.0" /> 
    <title>THE KIND</title>
    Any idea why?

  • #4
    The Apostate Apostropartheid's Avatar
    Join Date
    Oct 2007
    Posts
    3,215
    Thanks
    16
    Thanked 265 Times in 263 Posts
    I believe the margin you left on the body element is the what's causing the issues.

  • #5
    New to the CF scene
    Join Date
    Jun 2011
    Posts
    5
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by Apostropartheid View Post
    I believe the margin you left on the body element is the what's causing the issues.
    Without margins and center aligns it looks like this

    I have tried to set the scale to 2 manually, or a defined width of 320, that all doesn't do anything when I visit the site on my ipod.

  • #6
    New to the CF scene
    Join Date
    Jun 2011
    Posts
    5
    Thanks
    0
    Thanked 0 Times in 0 Posts
    This is how it looks like with no margins set anywhere, also the DIV Align center is out. Unfortunately it still doesn't work.

    I tried removing everything except for The Kind logo and that also doesn't work. I have a feeling that I am overlooking something very simple but can't find what it is!


  •  

    Posting Permissions

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