Help with font size and text alignment while using an id

For My heading at the top of my website im trying to add my logo with text next to it but im encountering 2 problems. I can't increase the size of my text without it making the header hugely increased to where it fills up the entire page... And i can't get the text to sit next to my image because of my main id for my header. Here's some code to see if you guys know what im talking about.. i don't know java script so don't use it please while trying to fix it using it cause i got no clue.. i only know css and regular html..



The main masthead that i believe is causing the problem



The main section below that im trying to edit for my header. All of fit is using the id masthead



<div id="masthead">
<img src="images/"MYimagehere.jpg" alt="" height="65">Textheretextheretextheretexthere</img>
<ol id="navlinks">
<li class="first"><a href="sire.org">clostering main

site</a></li>
<li><a href="http//agaasjg.org">hereliehe</a></li>
<li><a href="#.html">brewing</a></li>
<li><a href="drinking-instructions.html">drinking</a></li>
<li><a href="#">products</a></li>
<li class="last"><a href="#">contact us</a></li>
</ol>
<p id="today">
October 13, 2011
</p>
</div>

That's normal, you put the height on the picture so just to change the size of the text, you have to do like this

<img src="PICTURE LINK" /><font size="HEIGHT_OF_CARACTER(in percents or PX like -> 10px)">TEXT</font>

Alex,