html - Force horizontal table scrollbar -


i have table within modal popup. want table expand beyond container if necessary , give horizontal scrollbar. currently, doubles height of row if needs to: enter image description here

i want horizontal behaviour same vertical behaviour (expand , provide scrollbar). php / html generating table:

<div class="row"><div class="form-group col-md-12">     <label>history:</label>     <div id="table-scroll">         <table class="table table-bordered table-condensed">         <thead>             <th>date</th><th>from user</th><th>to user</th>             <th>from location</th><th>to location</th><th>by</th>         </thead>         <tbody>             <?php foreach($history $h){ ;?>                 <tr>                     <td><?=$h['date'];?></td>                     <td><?=$h['from_user'];?></td>                     <td><?=$h['to_user'];?></td>                     <td><?=$h['from_location'];?></td>                     <td><?=$h['to_location'];?></td>                     <td><?=$h['by_user'];?></td>                 </tr>             <?php } ;?>         </tbody>         </table>     </div> </div></div> 

this current css applied:

#table-scroll {   height: 150px;   overflow: auto; } #table-scroll th {     text-align: center; } 

use white-space:nowrap force text in 1 line , overflow data come in scroll.

#table-scroll {   height: 150px;   overflow: auto; } #table-scroll table{   white-space:nowrap;   width:100%; } #table-scroll th {     text-align: center; } 

Comments

Popular posts from this blog

Spring Boot + JPA + Hibernate: Unable to locate persister -

go - Golang: panic: runtime error: invalid memory address or nil pointer dereference using bufio.Scanner -

c - double free or corruption (fasttop) -