2013-10-15 31 views
0

我正在嘗試創建頁面,其中正面臨着對齊問題。 Jsp頁面在localhost中正常工作。 但是當我使用IP地址時,這是一些對齊問題。當我使用IP地址時,IE中的JSP對齊問題

可以請你幫我解決這個問題。

  <!DOCTYPE html> 
      <html lang="en"> 
      <head> 
      <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> 
      <title></title> 
      <script src="<%=request.getContextPath() %>/TSStatic/javascript/jquery-1.7.1.min.js"></script> 
      <script> 
      $(window).on('load resize',function(){ 

       $('#col3').css({top:$('#col2').height()}); 
      }); 
      </script> 

      <style type="text/css"> 
      html,body{height:100%;margin:0;padding:0} 
      html>body{ 
       margin-left: auto ; 
       margin-right: auto ; 
       width: 984px; 
       min-width: 953px; 
       max-width: 1260px; 

      } 
      #col1{ 

       overflow:hidden; 
       position:absolute; 
       width:100%; 
       top:136px; 
       bottom:15px; 


      } 

      #col2{ 
       background-color:green; 
       overflow:hidden; 
       position:absolute; 
       height : auto; 
       width : 984px; 

      } 

      #col3{ 
       background-color :pink; 
       overflow:auto; 
       position:inherit; 
       top : 0px;; 
       bottom : 15px; 
       width : 100%; 
       float : left; 
       clear : both; 
       display: inline-block; 
       } 


      #top{ 
       position:absolute; 
       left:0; 
       width:984px; 
       top:0px; 
       height:136px; 
       background:red; 
       overflow:hidden; 
      } 
      #bottom{ 
       position:absolute; 
       left:0; 
       width:984px; 
       height:30px; 
       bottom:0; 
       background:red; 
       overflow:hidden; 
      } 
      #wrap{ 
       height:100%; 
       text-align:center; 
       display:block; 
       position:relative; 
       margin: 0 auto; 

       } 
      </style> 
      <!--[if lte IE 6 ]> 
      <style type="text/css"> 

      * html {padding:330px 0 20px} 
      * html body{padding:330px 0 20px;padd\ing:0;} 
      * html #col1,* html #col2, * html #col3{  
       height:100%; 
       position:static; 
       float:left; 
      } 
      * html #top, * html #bottom{ 
       clear:both; 
       left:50%; 
       margin-left:-380px; 
      } 
      * html #wrap{ 
       width:860px; 
       margin:auto; 
       position:relative; 
       height:100%; 
      } 
      </style> 
      <![endif]--> 
      </head> 
      <body> 

      <div id="wrap"> 
      <div id="top"> 
       <h1>Header</h1> 
      </div> 
       <div id="col1"> 
        <div id="col2"> 

        </div> 

        <div id="col3"> 

        </div> 
       </div> 



      <div id="bottom"> 
       Footer 
      </div> 

      </div> 
      </body> 
      </html> 
+0

請提供一些代碼下面的鏈接。 – Sorter

回答

0