link with image and text

[Jaykappy]

looking to create a link in my web page
I want a small image of some sort and then some text to the right of then image but centered vertically to the image
I use the below BUT it puts the text AFTER the image and does not aligh vertical center.

<a href="http://www.yahoo.com"> something <img src="button.gif" />

Can I better control this will CSS?

Any thoughts or help would apprecited.

[Jaykappy]

Was able to do it with this, but the image is now on all three href's....
I am looking for an indivudual image per each "li"
Do I use an ID on each "li"

Last question.....the Home, Test and SOmething are all centered horizontally in the aside window...how do I make them left justtified?

aside id="asidenewsleft">
<p>Left ASIDE...</p>
<ul>
<li>Home</li>
<li>Test</li>
<li>Something</li>
</ul>
</aside>


#asidenewsleft li{
list-style:none;
padding:3px;
font:Bold 12px tahoma;
color:#666699;
background-image: url(button.gif);
background-repeat: no-repeat;
background-position: 0px 5px;
padding-left: 2px;
}

[Jaykappy]

alright did this....
and the text is now aligned left.....but now its over the image that I am using....

So now 2 issues:
1. How do I get the image first and then the text after it on same line
2. How do I modify this to allow me to use a specific image for each link


#asidenewsleft{
/* border:1px solid red; */
width:150px;
margin:15px 0;
padding:10px;
text-align:left;
}

#asidenewsleft li{
list-style:none;
padding:3px;
font:Bold 12px tahoma;
color:#666699;
background-image: url(button.gif);
background-repeat: no-repeat;
background-position: 0px 5px;
padding-left: 2px;
}

[Jaykappy]

Should I not be using the below for a list and links?

should I be using <a href"somelink"><a/>

If so how do I get images into the "a href"

aside id="asidenewsleft">
<p>Left ASIDE...</p>
<ul>
<li>Home</li>
<li>Test</li>
<li>Something</li>
</ul>
</aside>

[Jaykappy]

Finaly one....

Did this: <li><a href="http://www.yahoo.com"><img src="button.gif">Yahoo</a></li>

The image comes on the left of the text....BUT the text is aligned bottom in reference to the image.

1. How do I align the text vertically center to the image???
2. The text is right up against the image...how do I pad this distance so the text is away from the image?

Thanks

[Jaykappy]

want them to look similar to this page....where you login ....buttons images are aligned vertically with the text

Cant find out how to make the text vertically align with the image

<li><a href="http://www.nhl.com" style="font-size:11pt;font-weight:normal;color:#666699;font-family:'tahoma';font-style:normal;"><img src="button.gif" border="0"> NHL</a></li>