Vertical align text to the top of a div

EDIT: Didnt mean div i meant <p>, oops >.<.


See picture attatched

.title {

position:relative;
top:-30px;
background-color:#666666;
padding-left:10px;
padding-bottom:0px;
vertical-align:text-top;
width:334px;
height:28px;
margin:0;
background-image:url('../images/contentBorderHor.jpg');
background-repeat:repeat-x;
background-position:bottom;
}


<div id="main1"><p class="title"><img src="images/indexHeader1.png" width="143" height="28" style=" background-color:#CCCCCC;" />
<?php
if ($_SESSION['loggedIn'] == true)
{
echo "<a style=\"background-color:#eee;\" href=\"/inc_files/indexEdit.php?s=1\">Edit</a>";
}
?></p>
Some random test text
</div>

Can anyone help me figure out what i need to do so the text is at the very top of the div?

The paragraph area stops just under the vertical line under the dark grey box. the background colours are there just whilst i was checking the sizes of different elements.

Try resetting all your paddings and margins to 0

* {padding: 0; margin: 0;}