DataTables位于html页面的底部 [英] DataTables stays at the bottom of the html page
本文介绍了DataTables位于html页面的底部的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我的HTML页面有一个主要部分和一个侧边栏部分。以下是CSS代码:
My HTML page has a 'main' section and a 'sidebar' section. The following are the css codes:
$('#tabdat').DataTable();
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://cdn.datatables.net/1.10.15/js/jquery.dataTables.min.js"></script>
<link rel="stylesheet" type="text/css" href="//cdn.datatables.net/1.10.12/css/jquery.dataTables.min.css">
<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/1.10.15/js/dataTables.bootstrap.min.js">
<div class="sidebar" style="background-color: #e5e4d7;
margin-right: 10px;
margin-left: 0px;
margin-bottom: 10px;
margin-top: 5px;
border-radius: 5px;
padding:20px;
width:200px;
display:inline-block" ;>
<h4>LAST 30 DAYS</h4>
<ul>
<li><a href="accessories.php">MOBILE HANDSETS</a></li>
<li><a href="camera.php">CAMERA PHOTO</a></li>
</ul>
</div>
<div class="main" style="background-color: #e5e4d7;
margin-right: 0px;
margin-left: 270px;
margin-bottom: 10px;
margin-top: 5px;
border-radius: 5px;
padding:20px;
font-size: 70%;
display:inline-block;">
<h5 style="font-size:120%;">VANGUARD - MOBILE PHONE HANDSET</h5>
<table id='tabdat' class="row-border" cellspacing="0" width="100%">
<thead>
<tr>
<th>PARAMETER</th>
<th>SAMPLE</th>
<th>HOUSEHOLDS</th>
<th>POPULATION</th>
<th>SPENDS IN INR CR</th>
<th>AVERAGE SPENDS IN INR</th>
</tr>
</thead>
<tbody>
<tr>
<td>Tiger Nixon</td>
<td>System Architect</td>
<td>Edinburgh</td>
<td>61</td>
<td>2011/04/25</td>
<td>$320,800</td>
</tr>
<tr>
<td>Garrett Winters</td>
<td>Accountant</td>
<td>Tokyo</td>
<td>63</td>
<td>2011/07/25</td>
<td>$170,750</td>
</tr>
</tbody>
</table>
</div>
在我这一边酒吧我大约有30个href。表格 tabdat呈现正确。但是,表格被推到屏幕底部,并出现在侧栏之后。在CSS中,我尝试调整边距,宽度,填充,从侧边栏中删除了height参数,从侧边栏中删除了滚动设置。但是无法将dataTable转到屏幕顶部。
On my side bar I have around 30 href's. The table 'tabdat' renders properly. However, the table gets pushed to the bottom of the screen and appears after the sidebar. In CSS, I tried adjusting the margins, width, padding, removed height parameter from sidebar, removed scroll setting from sidebar. But couldn't get the dataTable to the top of the screen.
推荐答案
玩具应该
<div class="main">
当前您已使用: main
这篇关于DataTables位于html页面的底部的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文