Table pictures alignment issue

For the first time I am posting here cause if usually I am able to find a solution to my code issues throughout other answers, this time, no matter what I try, it doesn't work.

I am doing a table with two rows with basically pictures on the first row linking some PDF docs with a title below (second row).

The thing is that pictures do not have the same size (that can't be change). I would like them to be align on the bottom of the row, with a small margin before the separation line.

Right now, they are centered (by default I guess) which is not bad but not what I want anyway. The second issue that I have while they are centered is that the first picture of of the row is always a bit higher than the rest for some reason. Can't figure out why.

Hopefully you can help me with the code written below (I assume that its full of mistakes since several calls doesn't work and could probably be removed).

<table width="780"; bgcolor="#e8e8e8" style="table-layout:fixed" VALIGN="top">

<tr>


<td style="word-wrap: break-word;"; ALIGN="CENTER">
<div align="center";>

<a href="PDF URL" target="_blank">
        <img src="URL" alt="ALT">
    </a>
</div>
</td>

<td>
<div align="center">
<a href="PDF URL" target="_blank">
       <img src="URL" alt="ALT">
    </a>
</div>
</td>

<td>
<div align="center">
<a href="PDF URL" target="_blank">
       <img src="URL" alt="ALT">
    </a>
</div>
</td>



</tr>
<tr>
<td><div align="center"><p style="font-size:11px"><a title="TITLE1" href="URL" target="_blank">TITLE1</p></a>
</div></td>
<td><div align="center"><p style="font-size:11px"><a title="TITLE2" href="URL" target="_blank">TITLE2</p></a>
</div></td>
<td><div align="center"><p style="font-size:11px"><a title="TITLE3" href="URL" target="_blank">TITLE3</p></a>
</div></td>
<td><div align="center"><p style="font-size:11px"><a title="TITLE4" href="URL" target="_blank">TITLE4</p></a>
</div></td>

{/tr}
{/table}

Solution

You should first include a .css file call in your header like this:

<head>
<link rel="stylesheet" type="text/css" href="mystyle.css">
</head>

Then u can create a "mystyle.css" file in order to apply all the styles you want for your table.

Take a look at this page. W3School - CSS

There u have some examples about how to change color, margin, background images and so on.

EDIT:

If you want o apply all the styles in the .html file try looking at this web. http://www.w3schools.com/tags/

There u have all html tags, select the one u want and see the attributes could use.