0

在我的笔记本电脑上查看时,我的网页填满了整个屏幕,但在 iPhone 或 ipad 上查看并且设备垂直放置时,我的页面仅向下移动了大约 3 quarters,然后将所有空白区域留在了下方。我怎样才能解决这个烦人的问题?

    html {
padding:0;
margin:0;

}

body {
font-family: ‘Trebuchet MS’, Helvetica, sans-serif;
padding:0;
margin:0;
min-width:1100px;
color:#807979;
}

#container {
width:1000px;
margin:auto;
height:auto;
padding:0.5em 0;
}

#header {
width:100%;
}

#header1{
height:78px;
width:49.5%;
float:left;
}

#header2{
padding:15px 0 0 0;
width:49.5%;
float:right;
}

#content1 {
width:100%;
height:400px;
margin:0 0 1% 0;
clear:both;
}

#content2 {
width:45.5%;
height:250px;
float:left;
margin:0 0 1% 0;
padding:2%
}

#content3 {
width:45.5%;
height:250px;
float:right;
margin:0 0 1% 0;
padding:2%;

}

#footer {
width:100%;
height:150px;
clear:both;
background:url(images/footerback1.png);
color:#fff;
}

</head>

<body>
 <div id="container">

  <div id="header">
   <div id="header1">
    <img src="images/sdlogo.png"/>
   </div> <!--header1-->

   <div id="header2">
   <ul>
    <li><a href="home.html">Home</a></li>
    <li><a href="what we do.html">What We Do</a></li>
    <li><a href="contact us.html">Contact Us</a></li>
   </ul>
   </div> <!--header2-->
  </div> <!--header-->

  <div id="content1">
   <img src="images/main123.png"/>
  </div> <!--content1-->


  <div id="content2">
    <img src="images/ybyw.png"/>
     <p>SD Creative are a leading Web Design company in the north of England. We will ensure your website will stand out from the crowd. Its not all about
       looking good(that with us comes standard!) You need your website to work for you and help your business grow. Get in contact with us and let us help you. </p>
  </div> <!--content2-->

  <div id="content3">
   <img src="images/attractive.png"/>
    <p>Here at SD Creative Web Design we provide you with everything you need for your website. We create attractive websites that will work wonders for your company.</p>
  </div> <!--content3-->
 </div> <!--container-->


  <div id="footer">
  <div id="footerwrap">
   <div id="footer1" class="center">
    <ul id="bottom">
    <li><a href="home.html">Home</a></li>
    <li><a href="what we do.html">What We Do</a></li>
    <li><a href="contact us.html">Contact Us</a></li>
    </ul>
   </div> <!--footer1-->

   <div id="footer2">
    <p class="center">
    <a href="#"><img src="images/logo_facebook.png"/></a>
    <a href="#"><img src="images/twitter.png"/></a>
    </p>
   </div> <!--footer2-->

   <div id="footer3">
    <p>
    <img src="images/logosd.png"/>
    </p>
   </div> <!--footer3-->

  </div> <!--footerwrap-->
      <div id="footerbottom">
   <p class="center">Scott Doherty Creative, Middleham, Leyburn, North Yorkshire
  </div> <!--footerbottom-->

  </div> <!--footer-->



</body>

</html>
4

1 回答 1

0

尝试:

中心:

float: none !important;margin: 0 auto !important;
于 2014-04-19T17:37:10.060 回答