title: How to show my site in full screen on mobile (iphone)
body: <p>how i can make my website width in full screen not bigger than screen i use this code</p>
  
  <pre><code>&lt;head&gt;
      &lt;meta http-equiv="Content-Type" content="text/html; charset=utf-8" /&gt;
      &lt;meta name="viewport" content="widht=device-width, maximum-scale=1.0, minimum-scale=1.0, inittial-scale=1.0" /&gt;
      &lt;title&gt;website&lt;/title&gt;
      &lt;link rel="stylesheet" type="text/css" href="css/style.css" /&gt;
      &lt;link rel="stylesheet" type="text/css" media="only screen and (min-width:50px) and (max-width:730px)" href="css/style_small.css" /&gt;
      &lt;link media="only screen and (max-device-width: 730px)" href="css/style_small.css" type="text/css" rel="stylesheet" /&gt;
      &lt;!--[if lt IE 9]&gt;
      &lt;script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"&gt;&lt;/script&gt;
      &lt;![endif]--&gt;
  &lt;/head&gt;
  </code></pre>
  
  <p>and the css code </p>
  
  <pre><code>@charset "utf-8";
  /* CSS Document */
  
  body {
  background: #fff url(../images/Bbg.jpg) 0px 0px;
  width:100%;
  }
  
  .adlogo {
      background-image: url(../images/lbg.png);
      width: 100%;
      margin: 0px;
      border-bottom: #999 solid 1px;
      padding-bottom: 10px;
      display: inline-block;
      position: relative;
  }
  
  .adlogo .ads img {
      float:left;
      padding-top:2px;
      margin-left: 1%;
      width: 98%;
      height: 50px;
  }
  
  .adlogo .logo img {
      float:right;
      padding-top:2px;
      margin-right: 20%;
      width: 60%;
      height: auto;
  }
  
  .top {
      margin:0px 0px 0px 0px;
      padding:0px 0px 0px 0px;
      width: 100%;
      height: 40px;
      background: #1d1d1d;
      border-bottom: #2f2f2f solid 2px;
  }
  
  .top .menu1{
      visibility:hidden;
      position:absolute;
      max-width:730px;
  }
  
  .hmenu {
      background: url(../images/lbg.png);
      height: 200px;
  }
  
  .hmenu .menu2 {
      width:95%;
      margin-left:auto;
      margin-right:auto;
  }
  
  .hmenu .menu2 ul {
      padding:0px;
      width:185px;
      float: right;
      list-style-type: none;
      width:95%;
      margin-left:auto;
      margin-right:auto;
  }
  
  .hmenu .menu2 ul li{
      text-align:center;
      display:block;
      color: #a6abc5;
      display: block;
      width: 100%;
      margin-left:auto;
      margin-right:auto;
      padding: 9px;
      border:1px solid #21b8ff;
      -moz-border-radius: 12px;
      -webkit-border-radius: 12px;
      border-radius: 12px;
      margin-top: 10px;
  }
  
  .hmenu .menu2 ul li a{
      margin-left:auto;
      margin-right:auto;
      background: none;
      border: none;
  }
  
  .hmenu .menu2 ul li:hover{
      color:#636363;
      background: #21b8ff;
  }
  </code></pre>
  
  <p>but when i open the webiste in my phone i get that the website is not 100% on screen i get that the website is bigger than the mobile screen</p>