HTML table alignment help?

chained

New member
I have an outer table with 2 cells and in each of those cells are tables also. The first cell is longer so the table inside the second is centered on the cell. I want the second to be on the center top of the cell. I tried the align="" and stylesheets but they don't work.
 
You need to use valign="top" on the <td> tag surrounding the shorter table, as in this example:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd" >
<html lang='en'>
<head>
<meta http-equiv='Content-type' content='text/html;charset=UTF-8'>
<title>Table Vertical Alignment</title>
</head>
<body>
<h1>Table Vertical Alignment</h1>
<table width="100%" border="1">
<tr><td>
<table border="1">
<caption>Left Hand Inner Table</caption>
<tr><th>Row</th><th>Content</th></tr>
<tr><th>1</th><td>Here is</td></tr>
<tr><th>2</th><td>a table</td></tr>
<tr><th>3</th><td>with many</td></tr>
<tr><th>4</th><td>rows of</td></tr>
<tr><th>5</th><td>data.</td></tr>
</table>
</td><td valign="top">
<table border="1">
<caption>Right Hand Inner Table</caption>
<tr><th>Row</th><th>Content</th></tr>
<tr><th>1</th><td>Table with</td></tr>
<tr><th>2</th><td>few rows.</td></tr>
</table>
</td></tr>
</table>
</body>
</html>

However you should only use tables to display tabular data, such as price lists.

For page layout you should use CSS. For more on tables (and alternatives for page layout) see: http://www.html-tags-guide.com/html-table-tag.html
 
Back
Top