html - Same size for header and datas -
hy guys! !i have image:
i want resize first column minimum size , others must cover maximum width of page. i'll try in way, here css code:
/* generic style*/ table, td, th { border: solid# ccc;border - width: 1 px 0;border - collapse: collapse } .check { padding: 5 px 0 px;width: 1000 px } .name { padding: 5 px 100 px;width: 1000 px } .family { padding: 5 px 40 px;width: 1000 px } .productcode { padding: 5 px 30 px;width: 1000 px } .descr { padding: 5 px 20 px;width: 1000 px } td { padding: 5 px 0 px;width: 1000 px } /* fixed header */ div.tablewrap { position: relative;width: 1000 px;padding - top: 20 px } div.tablewrap - inner { width: 1000 px;height: 230 px;overflow: auto } div.tablewrap thead tr { position: absolute;top: -3 px }
here html code:
<div class="tablewrap"> <div class="tablewrap-inner"> <div ng-controller="ctrlread"> <table class="table table-hover" border="1"> <thead> <tr> <th class="check"> <input type="checkbox" onclick="checkall(this)" /> </th> <th class="name">nome <a ng-click="sort_by('name')"><i class="icon-sort"></i></a></th> <th class="family">famiglia <a ng-click="sort_by('family')"><i class="icon-sort"></i></a></th> <th class="productcode">codice prodotto <a ng-click="sort_by('productcode')"><i class="icon-sort"></i></a></th> <th class="descr">descrizione <a ng-click="sort_by('description')"><i class="icon-sort"></i></a></th> </tr> </thead> <tbody> <tr ng-repeat="item in items | orderby:sortingorder:reverse " id="lista"> <td> <input id="selectline1" type="checkbox" value="{{item.check}}" /> </td> <td>{{item.name}}</td> <td>{{item.family}}</td> <td>{{item.productcode}}</td> <td>{{item.descr}}</td> </tr> </tbody> </table> </div> </div> </div>
please give me hints!
in css have
.check{padding: 5px 0px;width:1000px}
you can change width width:100px
or less, resize suits best
.check{padding: 5px 0px; width:100px}
Comments
Post a Comment