Friday, 5 June 2015

div vertical center(middle) align




Then reason that I need vertical center, is showed above.


1. vertical-align: middle;
vertical-align: middle;
Other possible values:


vertical-align: baseline|length|sub|super|top|text-top|middle|bottom|text-bottom|initial|inherit;
http://www.w3schools.com/cssref/pr_pos_vertical-align.asp

however, this doesn't work for some elements: ul, li .... it works with td.

So in that case, I have to change my layout method from grid to table

2. table-- td has a special way to do this: (td also accept "vertical-align: middle" )

http://www.w3schools.com/tags/att_td_valign.asp

<table style="width:50%;">
    <tr>
      <th>Month</th>
      <th>Savings</th>
    </tr>
    <tr style="height:100px">
      <td valign="bottom">January</td>
      <td valign="middle">$100</td>
    </tr>
</table>



No comments:

Post a comment