Join the social network of Tech Nerds, increase skill rank, get work, manage projects...
 

  • Responsive web design is working on mobile device and Ipad

    @kushal.kant
    Recommendations Offline Message

    • 0
    • 2
    • 0
    • 1
    • 0
    • 0
    • 0
    • 0
    • 456
    Comment on it

    The Viewport Meta Tag

    1. <meta name="viewport" content="">

    Within the content=" " you can enter a load of comma delimited values, but were going to to focus on the fundamental ones for now.

    For example, if your mobile design is purposely laid out at 480px you can specify the viewport width:

    1. <meta name="viewport" content="width=480">

    For flexible layouts its more practical to base your viewport width on the device in question, so to match your layout width to the device width youd enter:

    1. <meta name="viewport" content="width=device-width">

    To be extra certain that your layout will be displayed as you intended it you can also set the zoom level. This, for example

    1. <meta name="viewport" content="initial-scale=1">

    will ensure that upon opening, your layout will be displayed properly at 1:1 scale. No zooming will be applied. You could even go further and prevent any zooming by the user:

    1.   <meta name="viewport" content="maximum-scale=1">
    meta tag responsive design meta tag responsive design viewport meta tag
    Comment on it

 0 Comment(s)

Sign In
Forgot Password?
                           OR                           
Create an account !!
                           OR                           
Register

Sign up using

                           OR                           
Forgot Password
Reset Password
Fill out the form below and reset your password: