CSS 2 - Vertical-align

 

[ A ]  [ B ]  [ C ]  [ D ]  [ E ]  [ F ]  [ H ]  [ L ]  [ M ]  [ O ]  [ P ]  [ Q ]  [ R ]  [ S ]  [ T ]  [ V ]  [ W ]  [ Z ]

vertical-align

    

Wartości:

  • baseline (wartość domyślna) - wyrównanie do lini bazowej elementu;
  • sub - wyrównanie poniżej linii bazowej elementu;
  • super - wyrównanie powyżej linii bazowej elementu;
  • top - wyrównanie do górnej części elementu;
  • text-top - wyrównanie do górnej linii tekstu;
  • text-bottom - wyrównanie do dolnej linii tekstu;
  • middle - wyrównanie do środkowej części elementu;
  • bottom - wyrównanie do dolej części elementu;
  • wartość wyrażona procentowo;
  • wartość wyrównania;
  • inherit - przejęcie wartości "rodzica".

 

Zastosowanie.

Przykład:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
   <meta http-equiv="content-type"   content="text/html; charset=iso-8859-2">
   <title>Pierwszy dokument</title>
   <style type="text/css">
      TD {vertical-align:bottom;}
</style>
</head>
<body>
   <table border="1" width="100%" height="100">
      <tr>
         <td width="100%">Przykładowy tekst</td>
      </tr>
   </table>
</body>
</html>

Efekt:

 

[ A ]  [ B ]  [ C ]  [ D ]  [ E ]  [ F ]  [ H ]  [ L ]  [ M ]  [ O ]  [ P ]  [ Q ]  [ R ]  [ S ]  [ T ]  [ V ]  [ W ]  [ Z ]