Saving content in two table columns attached to the roof of the corresponding table column
When using tables in a CSS based layout, I noticed that if I have a table with 4 columns (2 on the side are small for spacing, 2 in the middle for content) when I print the content in one of the two middle columns it will stay at the top which is perfect.
However, if I type content in the other middle column and press enter, the content in the other middle content is omitted.
This means that I can never enter content in two columns, keeping content in both columns glued to the top (roof) of the table column. I've tried everything, is there any way I can do this? If I cannot do this, my content looks clunky as it is not a two-column level and therefore unprofessional.
source to share
I believe the solution would be to create a rule that aligns the text to the top of the table cells.
td {
vertical-align:top;
}
Alternatively, you can use Columns and Columns to specify the vertical alignment of different columns. Example:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Table Columns Alignments</title>
</head>
<body>
<table>
<colgroup>
<col valign="bottom"/>
<col />
<col valign="top"/>
</colgroup>
<tbody>
<tr>
<td>aligned to bottom</td>
<td>no special<br/>alignment<br/><p>here</p></td>
<td>aligned to top</td>
</tr>
</tbody>
</table>
</body>
</html>
However, browser support for this is not across the board, hence YMMV.
source to share
I'm not sure if I fully understand the problem, but you can look at the vertical-aligned css property .
source to share