This documentation is archived and is not being maintained.

HtmlTableRow.VAlign Property

Gets or sets the vertical alignment of the content in the cells of a row in an HtmlTable control.

[Visual Basic]
Public Property VAlign As String
[C#]
public string VAlign {get; set;}
[C++]
public: __property String* get_VAlign();
public: __property void set_VAlign(String*);
[JScript]
public function get VAlign() : String;
public function set VAlign(String);

Property Value

The vertical alignment of the content in the cells of a row in an HtmlTable control. The default value is String.Empty, which indicates that this property is not set.

Remarks

Use the VAlign property to specify the vertical alignment of the content in the cells of a row in an HtmlTable control.

Note   Setting this property affects all cells in a row of a table represented by an instance of the HtmlTableRow class. To apply an alignment attribute to a single cell of a row, set the VAlign property for that cell.

The following table lists the values that can be used for this property.

Value Description
Top Aligns the contents of a cell with the upper edge of the cell.
Middle Aligns the contents of a cell in the center of the cell.
Bottom Aligns the contents of a cell with the lower edge of the cell.
Note   You can also use BaseLine as a value for this property. However, not all browsers support this feature.

Example

[Visual Basic, C#, JScript] The following example demonstrates how to use the VAlign property to control the vertical alignment of the contents of the cells in an entire row.

[Visual Basic] 
<%@ Page Language="VB" AutoEventWireup="True" %>

<html>
<head>

   <script runat="server">

      Sub Button_Click(sender As Object, e As EventArgs) 

         Dim i As Integer

         ' Iterate through the rows of the table.
         For i=0 to Table1.Rows.Count - 1
       
            ' Update the properties of each row. 
            Table1.Rows(i).Align = AlignSelect.Value 
            Table1.Rows(i).VAlign = VAlignSelect.Value 

         Next i

      End Sub

   </script>

</head>
<body>

   <form runat="server">

      <h3>HtmlTableRow Example</h3>

      <table id="Table1" 
             Border="1" 
             BorderColor="black" 
             runat="server">

         <tr>
            <td>
               Here's some content for Cell 1.
            </td>
            <td>
               Here's some content for Cell 2.
            </td>
         </tr>
         <tr>
            <td Width="100" Height="100">
               Here's some content for Cell 3.
            </td>
            <td Width="100" Height="100">
               Here's some content for Cell 4.
            </td>
         </tr>

      </table>

      <hr>

      Select the display settings for the cells in the table: <br><br>

      Align:
      <select id="AlignSelect" 
              runat="server">

         <option Value="Left" Selected="True">Left</option>
         <option Value="Center">Center</option>
         <option Value="Right">Right</option>
        
      </select>

      &nbsp;&nbsp;

      VAlign:
      <select id="VAlignSelect" 
              runat="server">

         <option Value="Top">Top</option>
         <option Value="Middle" Selected="True">Middle</option>
         <option Value="Bottom">Bottom</option>

      </select>
       
      <br><br>
  
      <input type="button" 
             value="Generate Table"
             OnServerClick = "Button_Click" 
             runat="server"/>

   </form>

</body>
</html>

[C#] 
<%@ Page Language="C#" AutoEventWireup="True" %>

<html>
<head>

   <script runat="server">

      void Button_Click(Object sender, EventArgs e) 
      {

         // Iterate through the rows of the table.
         for (int i=0; i<=Table1.Rows.Count - 1; i++)
         {
       
            // Update the properties of each row. 
            Table1.Rows[i].Align = AlignSelect.Value; 
            Table1.Rows[i].VAlign = VAlignSelect.Value; 

         }

      }

   </script>

</head>
<body>

   <form runat="server">

      <h3>HtmlTableRow Example</h3>

      <table id="Table1" 
             Border="1" 
             BorderColor="black" 
             runat="server">

         <tr>
            <td>
               Here's some content for Cell 1.
            </td>
            <td>
               Here's some content for Cell 2.
            </td>
         </tr>
         <tr>
            <td Width="100" Height="100">
               Here's some content for Cell 3.
            </td>
            <td Width="100" Height="100">
               Here's some content for Cell 4.
            </td>
         </tr>

      </table>

      <hr>

      Select the display settings for the cells in the table: <br><br>

      Align:
      <select id="AlignSelect" 
              runat="server">

         <option Value="Left" Selected="True">Left</option>
         <option Value="Center">Center</option>
         <option Value="Right">Right</option>
        
      </select>

      &nbsp;&nbsp;

      VAlign:
      <select id="VAlignSelect" 
              runat="server">

         <option Value="Top">Top</option>
         <option Value="Middle" Selected="True">Middle</option>
         <option Value="Bottom">Bottom</option>

      </select>
       
      <br><br>
  
      <input type="button" 
             value="Generate Table"
             OnServerClick = "Button_Click" 
             runat="server"/>

   </form>

</body>
</html>

[JScript] 
<%@ Page Language="JScript" AutoEventWireup="True" %>

<html>
<head>

   <script runat="server">

      function Button_Click(sender, e : EventArgs) 
      {

         // Iterate through the rows of the table.
         for (var i : int =0; i<=Table1.Rows.Count - 1; i++)
         {
       
            // Update the properties of each row. 
            Table1.Rows[i].Align = AlignSelect.Value; 
            Table1.Rows[i].VAlign = VAlignSelect.Value; 

         }

      }

   </script>

</head>
<body>

   <form runat="server">

      <h3>HtmlTableRow Example</h3>

      <table id="Table1" 
             Border="1" 
             BorderColor="black" 
             runat="server">

         <tr>
            <td>
               Here's some content for Cell 1.
            </td>
            <td>
               Here's some content for Cell 2.
            </td>
         </tr>
         <tr>
            <td Width="100" Height="100">
               Here's some content for Cell 3.
            </td>
            <td Width="100" Height="100">
               Here's some content for Cell 4.
            </td>
         </tr>

      </table>

      <hr>

      Select the display settings for the cells in the table: <br><br>

      Align:
      <select id="AlignSelect" 
              runat="server">

         <option Value="Left" Selected="True">Left</option>
         <option Value="Center">Center</option>
         <option Value="Right">Right</option>
        
      </select>

      &nbsp;&nbsp;

      VAlign:
      <select id="VAlignSelect" 
              runat="server">

         <option Value="Top">Top</option>
         <option Value="Middle" Selected="True">Middle</option>
         <option Value="Bottom">Bottom</option>

      </select>
       
      <br><br>
  
      <input type="button" 
             value="Generate Table"
             OnServerClick = "Button_Click" 
             runat="server"/>

   </form>

</body>
</html>

[C++] No example is available for C++. To view a Visual Basic, C#, or JScript example, click the Language Filter button Language Filter in the upper-left corner of the page.

Requirements

Platforms: Windows 98, Windows NT 4.0, Windows Millennium Edition, Windows 2000, Windows XP Home Edition, Windows XP Professional, Windows Server 2003 family

See Also

HtmlTableRow Class | HtmlTableRow Members | System.Web.UI.HtmlControls Namespace | BgColor | BorderColor | Height | Align | VAlign

Show: