CSS设计网站浮动错误（低分辨率与高分辨率）

我有一个浮动css的问题..它是完美的低分辨率，但它的高分辨率打破。我有两列，左和右，它们分别是float：left和float：right。当我以低分辨率运行时，它是完美的显示屏。像这样：CSS设计网站浮动错误（低分辨率与高分辨率）

enter image description here

但是，当我在高分辨率运行它，是这样的：

enter image description here

下面是一些代码：的index.php

<body> 
    <div id="Content"> 
     <div id="top-left"> 
      <div class="floatLeft" style="padding-top:34px"> 
       <hr align="left" class="line1"> 
       <div id="language"> 
        <?php 
         include("include/language.php"); 
        ?> 
       </div> 
       <div class="clearBoth"></div> 
      </div> 
      <div class="imageIndex"><img src="images/coba.jpg"></div> 
      <div class="clearBoth"></div> 
     </div> 

     <div id="top-right"> 
      <div id="csStatus" style="margin-left:-17px"> 
       <?php 
        include("include/status.php"); 
       ?> 
      </div> 
      <div style="height:75px"> 
       <?php 
        include("include/marketing.php"); 
       ?> 
      </div> 

      <div id="captionSlide"> 

      </div> 
      <div class="floatLeft" style="padding-top:113px"><hr class="line2"></div> 
     </div> 
     <div class="clearBoth"></div> 

     <div class="floatLeft" style="margin-left:87px;margin-top:-110px;"> 
      <img src="images/side.png"> 
     </div> 
     <div id="contentTop"> 
      <div id="logo"> 
       <?php 
        include("include/logo.php"); 
       ?> 
      </div> 
      <div class="floatLeft" style="margin-left:54px"><img src="images/ctr.png"></div> 
      <table id="search"> 
       <?php 
        include("include/search.php"); 
       ?> 
      </table> 
      <br> 

      <div id="menuLeft"> 
       <?php 
        include("include/menu-left.php"); 
       ?> 
      </div> 
      <div id="menuRight"> 
       <?php 
        include("include/menu-right.php"); 
       ?> 
      </div> 
      <br><br><br><br> 

      <div id="contentWeb"> 
       <div id="contentLeft" style="float:left;"> 
        <table id="leftTable"> 
         <tr> 
          <td style="width:195px"> 
           <div id="stockist"> 
            PROJECT<br> 
            <img src="images/stockist.jpg" class="imageBorder"> 
           </div> 
          </td> 
          <td style="width:230px;vertical-align:top;"> 
           <span id="agenda"> 
            AGENDA 
           </span><br><br> 

          </td> 
         </tr> 
        </table> 
       </div> 
       <div id="contentRight" style="float:right;"> 
        <table id="rightTable"> 
         <tr> 
          <td style="width:230px;vertical-align:top;"> 
           <span id="latestProduct"> 
            LATEST PRODUCT 
           </span><br><br> 
           <table> 

           </table> 
          </td> 
         </tr> 
        </table> 
       </div> 
      </div> 
     </div> 
     <div class="clearBoth"></div> 
     <div id="Footer"> 
      <div id="contentFooter"> 
       PT. TANGGA MAS JAYA MAKMUR scaffolding | Published by. BixelLite &copy; 2012 
      </div> 
     </div> 
    </div> 
</body>

这里是一些css：

#Content { 
margin:0px auto;} 

.floatLeft{ 
float:left;} 

#top-left{ 
float:left;} 

#top-right{ 
float:right;} 

#Footer{ 
background-color:#90bc21; 
width:546px; 
height:39px; 
text-align:right;}

任何建议如何解决它？

非常感谢。

来源

2012-08-04 xuweisen

我们展示您的代码，在这个问题上还是放一些小提琴。 – krish 2012-08-04 05:09:58

好吧，等等，我会更新它 – xuweisen 2012-08-04 05:26:40

我已经用代码和css更新了它。谢谢 – xuweisen 2012-08-04 05:44:03

只需设置一个宽度在你的内容一致

由于把一切都相同的宽度，以Torr3nt

来源

2012-08-04 08:42:13 xuweisen

CSS设计网站浮动错误（低分辨率与高分辨率）

回答

相关问题