user3639557 user3639557 - 17 days ago 6
HTML Question

aligning rows' contents in HTML table

Beginner HTML learner here and he is stuck! I have developed the following html code and the output is the image that I put right below the code. I need to push the image up and align its top with the second rows (XXXX), but whatever I tried, didn't work!

And this is what the page looks like:

enter image description here



<HTML><HEAD><TITLE>XXXXX Page </TITLE>

<style type="text/css">
* {
padding: 0;
margin: 0;
font-family: georgia, palatino, "times new roman", times;
}
body {
font-size: 1em;
width: 80em;
margin: 10em 2em 1em 2em;
background-color: #F8F8F8;
}
* tt {
font-family: "lucida console", menlo, monaco, "courier new", courier, monospace;
}
* td {
font-weight: normal;
padding: 0em 0.25em 0.5em 0.25em;
text-align: left;
}
* a { text-decoration: none; color: #0033EE; }
</style>

</HEAD>
<BODY>
<TABLE border=0 cellpadding=20 cellspacing=10>
<TBODY>
<TR>
<TD valign=bottom>
<TABLE BORDER=0>
<TBODY>
<TR>
<TD align=left valign=bottom>
<IMG
alt="XXXX" border=0 height=200
src="XXXX.jpg" width=200>
</TD></TR></TBODY></TABLE>
<div id="copyright">
<center><font size="1">[XXXX]</font></center>
</div>
</TD>
<TD valign=bottom>
<TABLE>
<TBODY>
<TR>
<TD vAlign=top><FONT size=+3>XXXX </FONT> [at gmail dot com] </TD>
</TR>
<TR>
<TD><font size=+1>XXXX</font></TD>
</TR>
<TR>
<TD><font size=+1>XXXXX</font>
</TD></TR>
<TR>
<TD><font size=+1>XXXXX<br><br>
XXXX<br>
XXXX <br>
XXXX </font>
</TD></TR>
<TR>
<TD>&nbsp;</TD>
</TR>
<TR>
<TD><font size=+1><b>XXXX</b></font>
</TD></TR>
<TR>
<TD valign=bottom><font size="+1"><B>XXXX</B>
&nbsp; | &nbsp; <A href="Alpha.pdf">YYYY</A>
</font>
</TD>
</TR>
</TBODY>
</TABLE>
</TD>
</TR>
</TBODY>
</TABLE>
</BODY>
</HTML>




Answer

Add this to your CSS:

td { vertical-align: top; }