HTML CSS examples for CSS Widget:Div Table
CSS: Float div left next to table of arbitrary width
<html> <head> <meta name="viewport" content="width=device-width, initial-scale=1"> <style id="compiled-css" type="text/css"> .visualisation-table { border:2px solid Chartreuse; float:left; } .visualisation-moreinfo {<!--from w w w . j a va 2s. c o m--> border:2px solid yellow; overflow:hidden; } </style> </head> <body> <div class="visualisation-table"> <div class="table-toggle"> <table class="floated-header"> <thead> <tr> <th scope="col" width="244">Lorem ipsum dolor </th> <th scope="col" width="206">Lorem ipsum dolor sit</th> </tr> </thead> <tbody> <tr> <td class="dateRange" width="244">Lorem ipsum dolor sit amet</td> <td class="percent" width="206">Lor</td> </tr> <tr> <td class="dateRange">Lorem ipsum dolor sit ame</td> <td class="percent">Lor</td> </tr> <tr> <td class="dateRange">Lorem ipsum dolor sit ame</td> <td class="percent">Lor</td> </tr> <tr> <td class="dateRange">Lorem ipsum dolor sit amet</td> <td class="percent">Lorem i</td> </tr> <tr> <td class="dateRange">Lorem ipsum dolor sit amet</td> <td class="percent">Lorem i</td> </tr> <tr> <td class="dateRange">Lorem ipsum dolor sit ame</td> <td class="percent">Lorem i</td> </tr> <tr> <td class="dateRange">Lorem ipsum dolor sit ame</td> <td class="percent">Lorem i</td> </tr> <tr> <td class="dateRange">Lorem ipsum dolor sit amet</td> <td class="percent">Lorem i</td> </tr> <tr> <td class="dateRange">Lorem ipsum dolor sit amet</td> <td class="percent">Lorem i</td> </tr> </tbody> </table> </div> </div> <div class="visualisation-moreinfo"> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi ullamcorper molestie lacus sed fermentum. Aliquam erat volutpat. V </div> </body> </html>