Lining up text with image

HTML & CSS
1

I know this is basic stuff, but I can’t line up this text. I’ve tried:

<font size="5" color="#000000" face="arial" align="middle">TEXT</font>
<img src="/default/images/IMAGE.jpg" alt="" />

<font size="5" color="#000000" face="arial" 
 vertical-align="middle">TEXT</font>
<img src="/default/images/IMAGE.jpg" alt="" />

<font size="5" color="#000000" face="arial" 
 align="left">TEXT</font>
<img src="/default/images/IMAGE.jpg" alt="" />

But the TEXT still sits at the bottom next to the bottom of the image. What can I try to get the text floating to the left of the image in the middle?

Thanks

2

O Lordy, <font> tags? They are over ten years out of date. Here’s a better way to do this:


<!DOCTYPE html>
<html lang="en">

<head>
<meta charset="utf-8">
<title>Align Image and Text</title>
<style type="text/css" media="all">
  p {font-size: 1.5em; font-family: arial, sans-serif;}
  p img {vertical-align: middle;}
</style>
</head>

<body>
  <p>TEXT <img src="/default/images/IMAGE.jpg" alt=""></p>
</body>

</html>