Implement left div fixed width, right div adaptive

(1) using float

<div class="use-float">    <div></div> <div></div></div>

.use-float>div:first-child{ width:100px; float:left;}.use-float>div:last-child{ overflow:hidden;}

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -

(2) using table

 <table class= "use-table" Span class= "NT" >> <tr> <td></td> <TD ></td> </tr> </TABLE>      

.use-table{    border-collapse:collapse; width:100%;}.use-table>tbody>tr>td:first-child{ width:100px;}

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -

(3) simulating table with Div

 <div class= " Use-mock-table "> <div></div> <div></ Div></DIV>         

.use-mock-table{    display:table; width:100%;}.use-mock-table>div{ display:table-cell;}.use-mock-table>div:first-child{ width:100px;}

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -

(4) using Flex

<div class="use-flex">    <div></div> <div></div></div>

.use-flex{    display:flex;}.use-flex>div:first-child{ flex:none; width:100px;}.use-flex>div:last-child{ flex:1;}

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -

:(based on the above style, I added a height and a border, to see the following look ...) ）

Implement left div fixed width, right div adaptive