Search code examples
androidmobilefullscreen

How to make fullscreen page in mobile content?


what I need is

-disabled zoom function

-fullscreen page (both in web browser and mobile view)

-disabled scrolling page

what I have done so far..

<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=yes">
</head>
<body leftmargin="0" topmargin="0" rightmargin="0" bottommargin="0">
</body>

I can't figure it out how to make the page fullscreen on mobile view.

When I run on my phone, it just display half of the page. While leaving the other space blank.

Please help me solve it.

Thank you very much.


Solution

  • full screen & zoom :

    <meta content='width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0' name='viewport' />
    

    and for disabled scroll try to add this in ur css :

    html, body {
      overflow-x: hidden;
    }
    

    and try to delete all margin settings in your body tag by this properties in your main css file

    * {
    margin : 0;
    padding: 0;
    }