<style> .universal-dropdown{ float:left; } tr>th:first-child{ display: none!important; } tr>td:first-child{ display: none!important; } .col-ken{ min-width: 4em; &:first-child{ min-width: unset!important; } } .universal-table-index3{ table-layout: auto!important; .universal-th-icon{ margin:0; } .universal-th-text { margin: 0; .universal-th-icon{ margin:0; } .universal-th-text { margin: 0; } } } .universal-th-text{ white-space: pre!important; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; white-space: normal; } .universal-dropdown-menu { padding: 15px 18px; white-space: nowrap; } .universal-th-text { padding: 8px 0 0 0; display: inline; margin-right: 5px; } .universal-dropdown { display: inline-block; } a.universal-btn { vertical-align: baseline; color: #fff; } .universal-table-index { border-collapse: collapse; border: 1px solid #eee; table-layout: fixed; word-wrap: break-word; } .universal-table-index h3 { float: left; margin: 0; } .universal-table-index.table td{ padding: 15px 18px; } .universal-table-index thead th:last-child .dropdown-menu { left: auto; right: 0; } .universal-th-icon { border: 1px solid #eee; padding: 5px 8px; margin-right: 5px; color: gray; cursor: pointer; } .universal-th-text.no-sort.no-search { position: relative; top: -6px; } .image-preview { width: 120px; } </style> <table class="table table-hover table-striped universal-table-index universal-table-index1"> <caption> <h3>{{table-name}}</h3> <a href="{{url}}" class="universal-btn btn btn-info pull-right {{reset}}"><i class="fa fa-refresh"></i> Reset</a> </caption> <thead> <tr data-list="head-columns" data-level="0"> <th class="col-ken"> <a href="{{sort-url}}" class="{{sort}}"><i class="universal-th-icon fa fa-{{sort-class}}"></i></a> <div class="dropdown universal-dropdown {{search}}"> <button class="btn btn-sm" id="dLabel" type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"> <i class="fa fa-search"></i> <span class="caret"></span> </button> <div class="dropdown-menu universal-dropdown-menu" aria-labelledby="dLabel"> <form class="form-inline universal-form-inline" action="{{url}}" method="get"> <div class="form-group"> {{form-field}} <input type="hidden" value="{{key}}" name="column" > </div> <button class="btn btn-primary" type="submit" class="btn btn-default">Go</button> </form> </div> </div> <div class="universal-th-text {{title-class}}">{{title}}</div> </th> </tr> </thead> <tbody data-level="0" data-list="rows"> <tr data-level="1" data-list="columns"> <td>{{text}}</td> </tr> </tbody> </table> <div>{{total_entries}}</div> <div>{{export_button}}</div> {{pagination_goes_here}} <script> </script> <style> .universal-table-index.dtr-inline.collapsed td.dtr-control{ vertical-align: middle; } </style>