I'm trying to align two text rows next to the center of the image. I tried `"vertical-align: middle;"` but it does't keep my text in two rows like so:
[this is what I'm trying to achieve.](http://i.stack.imgur.com/65AdS.jpg)

My code consists of:

```
<p class="address">          
    <img class="logo" src="source" alt="">
    <span class="location">Line 1 of text</span>
    <span class="location_2"> Line 2 of text</span>
</p>

```

With CSS code:

```
p.address{font-family: Helvetica; font-size: 13px; color: #000000; margin-left: 0px;vertical-align:center;}
span.location{display: inline; }
span.location_2{display: block; }

```

I also tried this solution: <http://jsfiddle.net/hiral/bhu4p04r/7/> - but it show the text under the image.

The image is `34x58px` and I'm trying to achieve this for an Outlook html signature.

I'm going to try using a `<div>` container, put the `<img>` in it, then the `<p>`, dunno if it will work.

ANSWER with positive result given by LGSon with minor modification, example below:

```
    <table style="margin-bottom:5px; font-family: Helvetica; font-size: 13px; color: #000000;">
  <tr>
    <td>
      <img style="max-height:52px" src="img_source_here" alt="">
    </td>
    <td valign="middle" style="font-size:14px; margin-left: 10px;">
      Text 1<br>Text 2
    </td>
  </tr>
</table>

```

Thank you all for the help!