HTML CSS Reference/CSS Attributes and Javascript Style Properties/vertical align

Материал из Web эксперт
Перейти к: навигация, поиск

"vertical-align" Example

    
<html>
<body>
<table width="70%" border="1" cellspacing="5" cellpadding="5">
   <tr height="50">
      <td>Cell 1 content</td>
      <td>Cell 2 content</td>
   </tr>
   <tr height="100" id="myT">
       <td><img src="http://www.wbex.ru/style/logo.png">Cell 3 text content</td>
       <td>Cell 4 text content</td>
   </tr>
</table>
<br>
<input type="button" 
       onclick="myT.style.verticalAlign="text-top"" 
       value="Set verticalAlign to text-top">
<input type="button" 
       onclick="myT.style.verticalAlign="text-bottom"" 
       value="Set verticalAlign to text-bottom">
<input type="button" 
       onclick="myT.style.verticalAlign="top"" 
       value="Set verticalAlign to top">
<input type="button" 
       onclick="myT.style.verticalAlign="bottom"" 
       value="Set verticalAlign to bottom">
<input type="button" 
       onclick="myT.style.verticalAlign="auto"" 
       value="Restore position">
</body>
</html>



"vertical-align" is applied to

+----------------+--------------------------------------------------------------+
| Applied_To     |<col>                           currentStyle                  |
|                |<custom>                        defaults                      |
|                |<img>                           runtimeStyle                  |
|                |<span>                          style                         |
|                |<tbody>                         <td>                          |
|                |<tfoot>                         <th>                          |
|                |<thead>                         <tr>                          |
+----------------+--------------------------------------------------------------+



"vertical-align" Possible Values

Possible Values
auto,
baseline (the default),
sub (aligns to subscript),
sup (aligns to superscript),
top,
middle,
bottom,
text-top,
text-bottom.



"vertical-align" Syntax and Note

Note:
Controls the vertical alignment.
Syntax:
    
element { vertical-align: value }
elementID.style.verticalAlign = "value"
document.all.elementID.style.verticalAlign = "value" // IE only
Источник — «http://wbex.ru/index.php?title=HTML_CSS_Reference/CSS_Attributes_and_Javascript_Style_Properties/vertical_align&oldid=6112»