jQuery DataTable分頁問題

我使用最新的如果jQuery DataTables。jQuery DataTable分頁問題

我正在努力解決一個問題，我不確定它是什麼以及如何解決它。數據表的底部分頁與我的底部div容器重疊，我不確定它爲什麼這樣做？有人能幫我解決問題嗎？

這裏是我的HTML標記：

<!DOCTYPE html> 
<html> 
    <head> 
     <title></title> 
     <link href="Assets/DataTables-1.9.0/jquery.dataTables.css" rel="stylesheet" type="text/css" /> 
     <link href="Assets/Stylesheets/pbe_l_r2.css" rel="stylesheet" type="text/css" /> 
    </head> 
    <body> 

     <div class="main-container">Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Maecenas sit amet metus. Nunc quam elit, posuere nec, auctor in, rhoncus quis, dui. Aliquam erat volutpat. Ut dignissim, massa sit amet dignissim cursus, quam lacus feugiat.</div> 
     <div class="main-container">Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Maecenas sit amet metus. Nunc quam elit, posuere nec, auctor in, rhoncus quis, dui. Aliquam erat volutpat. Ut dignissim, massa sit amet dignissim cursus, quam lacus feugiat.</div> 
     <div class="main-container"> 

      <table id="example"> 
       <thead> 
        <tr> 
         <th>Rendering engine</th> 
         <th>Browser</th> 
        </tr> 
       </thead> 
       <tbody> 
        <tr> 
         <td>Gecko</td> 
         <td>Mozilla 1.8</td> 
        </tr> 
        <tr> 
         <td>Webkit</td> 
         <td>Safari 1.2</td> 
        </tr> 
        <tr> 
         <td>Gecko</td> 
         <td>Mozilla 1.8</td> 
        </tr> 
        <tr> 
         <td>Webkit</td> 
         <td>Safari 1.2</td> 
        </tr> 
       </tbody> 
      </table> 

     </div> 

     <script src="Assets/JavaScripts/jquery-1.7.1.min.js" type="text/javascript"></script> 
     <script src="Assets/DataTables-1.9.0/jquery.dataTables.min.js" type="text/javascript"></script> 
     <script> 

      $(document).ready(function() { 
       $('#example').dataTable(); 
      }); 

     </script> 

    </body> 
</html>

這裏是我的層疊樣式表：

h1,h2,h3{margin-top:0;} 

#extra{width:300px;} 
#main{width:725px;} 

.main-container{border:1px solid #000;padding:1em 1em 1em 1em;}

這是所有我有我的網頁和樣式表上。看看包含我的數據表的div。數據表的底部似乎與底部填充重疊。我目前使用IE 8和FireFox 10.0.2的最新版本。

來源

2012-03-07 Brendan Vogt

我在表格後添加了<div style="clear:both"></div>。

來源

2012-03-08 11:07:40

jQuery DataTable分頁問題

回答

相關問題