Datatable show entries dropdown height
Datatable show entries dropdown height
HuuD
Posts: 1Questions: 1Answers: 0
Hi,
I have this bootstrap datatable whose show entries dropdown is too small, how can I change its height, this is an admin template downloaded from internet.
https://postimg.org/image/8tfdblo3vv/
<!DOCTYPE html>
<html>
<link href="../assets/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
<link href="../assets/css/style.css" rel="stylesheet" type="text/css" />
<link href="../assets/plugins/bootstrap-select/css/bootstrap-select.min.css" rel="stylesheet" />
<link href="../assets/plugins/select2/css/select2.min.css" rel="stylesheet" type="text/css" />
<!--Footable-->
<link href="../assets/plugins/footable/css/footable.core.css" rel="stylesheet">
<!-- DataTables -->
<link href="../assets/plugins/datatables/dataTables.bootstrap4.min.css" rel="stylesheet" type="text/css" />
<link href="../assets/plugins/datatables/buttons.bootstrap4.min.css" rel="stylesheet" type="text/css" />
<!-- Responsive datatable examples -->
<link href="../assets/plugins/datatables/responsive.bootstrap4.min.css" rel="stylesheet" type="text/css" />
<!-- Begin page -->
<div class="row">
<div class="col-12">
<h5 class="mt-0 m-b-20">Search and View student fee status</h5>
<table id="datatable" class="table table-bordered table-colored table-custom table-hover toggle-circle m-b-0" data-page-size="7">
<tr class="active">
<td colspan="5">
<div class="text-right">
<ul class="pagination pagination-split footable-pagination m-t-10 m-b-0"></ul>
</div>
</td>
</tr>
</tfoot>
</table>
</div>
</div> <!-- end row -->
</div>
</div>
</div>
</div>
<!-- END wrapper -->
<!-- jQuery -->
<script src="../assets/js/jquery.min.js"></script>
<script src="../assets/js/tether.min.js"></script><!-- Tether for Bootstrap -->
<script src="../assets/js/bootstrap.min.js"></script>
<!-- App js -->
<script src="../assets/js/jquery.core.js"></script>
<script src="../assets/js/jquery.app.js"></script>
<script src="../assets/plugins/select2/js/select2.min.js" type="text/javascript"></script>
<script src="../assets/plugins/bootstrap-select/js/bootstrap-select.js" type="text/javascript"></script>
<script src="../assets/plugins/timepicker/bootstrap-timepicker.js"></script>
<script src="../assets/plugins/bootstrap-datepicker/js/bootstrap-datepicker.min.js"></script>
<script src="../assets/pages/jquery.form-pickers.init.js"></script>
<script src="../assets/plugins/bootstrap-colorpicker/js/bootstrap-colorpicker.min.js"></script>
<!--FooTable-->
<script src="../assets/plugins/footable/js/footable.all.min.js"></script>
<script src="../assets/plugins/datatables/jquery.dataTables.min.js"></script>
<script src="../assets/plugins/datatables/dataTables.bootstrap4.min.js"></script>
<!-- Responsive examples -->
<script src="../assets/plugins/datatables/dataTables.responsive.min.js"></script>
<script src="../assets/plugins/datatables/responsive.bootstrap4.min.js"></script>
<script type="text/javascript">
$('#datatable').DataTable();
</script>
</body>
</html>
This discussion has been closed.
Answers
"I'm having the same problem. It keeps adding
form-group-smclass. I need to remove this but don't know how. Has anyone else solved this? I've been trying to figure this out for a long time."Hi @tdespenza ,
We're happy to take a look, but as per the forum rules, please link to a test case - a test case that replicates the issue will ensure you'll get a quick and accurate response. Information on how to create a test case (if you aren't able to link to the page you are working on) is available here.
Cheers,
Colin