Question

I have a table used within a cshtml page. I have following requirements

1. This table will have two rows
2. This table should take all the space of chstml page(in win-forms term it should dock to parent )
3. First row conatins a TextBox that should take all space of the first row.
4. Second row will contain a label.
5. First row will take 90% of the table height whereas second row will take 10% of the table height

I am pretty novice with tr and td etc. Below is my starting point, any help will be much appreciated.

<table >
    <tr>
        <td >
            @Html.TextBoxFor( m => m.Description)
        </td>
    </tr>
    <tr>
        <td>
            @Html.LabelFor( m => m.SomeThing)
        </td>
    </tr>
</table>

Answer 1

You can control the height of the row with the height of the cell. I would recommend using CSS to control it but you can do it inline as well. Allowing the browser to control the height of the table is best practice and then just set the height of the first row to 90%, the table should be 100% of the area it’s in and then the 2nd row will only take up 10% of the table. This should work:

 <div style="height:100%">
   <table>
    <tr>
        <td style="height:90%">
            @Html.TextBoxFor( m => m.Description)
        </td>
    </tr>
    <tr>
        <td style="height:10%">
            @Html.LabelFor( m => m.SomeThing)
        </td>
    </tr>
  </table>
 </div>