Table cell vertical-align: baseline : td align « Tags « HTML / CSS






Table cell vertical-align: baseline

   

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
   <html>
        <head>
            <title></title>
            <style type='text/css'>
               table {
                   font: 16px sans-serif;
                   border: 1px solid black;
               }
               td {
                   border: 1px solid black;
                   width: 125px;
               }
               td#largefont {
                   font-size: 60px;
                   vertical-align: baseline;
               }
               td.baseline {
                   vertical-align: baseline;
               }               

            </style>
        </head>
        <body>
            <table>
                <tr>
                    <td class='baseline' id='largefont'>
                        L
                    </td>
                    <td class='baseline'>
                        The contents of this cell 
                        are aligned to the baseline.
                    </td>

                </tr>            
            </table>
        </body>
    </html>

   
    
  








Related examples in the same category

1.Table cell background and align, indent
2.Vertically aligned to the top of the cell
3.vertically aligned to the middle of the cell
4.vertically aligned to the bottom of the cell
5.table cell alignment
6.Table cell with vertical-align: top
7.Table cell with vertical-align: baseline
8.table cells with vertical alignment
9.td vertical-align: baseline;
10.td vertical-align: top;
11.td vertical-align: middle;
12.td vertical-align: bottom;