Align text to right of Image - html

Question

I'd like to align all 3 lines of text to the right of my image. Currently it wraps on the 2nd line.
How do I do this?
http://jsfiddle.net/bhu4p04r/
CSS:
img {
min-width:75px;
height:90px;
vertical-align:middle;
margin-right:30px
}
HTML:
<div class="medium-12 columns"><img src="http://placekitten.com/g/75/90" />1<br />2<br />3</div>

Answer 1

Wrap your text in a div, and make image float:left.
<div class="medium-12 columns">
<img src="http://placekitten.com/g/75/90" class="left" />
<div class="right">1
<br />2
<br />3</div>
</div>
DEMO here.
Vertically middle text:
Give display:inline-block; to image and the text container.
img, .text {
display:inline-block;
vertical-align:middle
}
See DEMO here.

Answer 2

float: left on your image is the way to go.
http://jsfiddle.net/bhu4p04r/2/
Or another alternative (to keep the text centered)
http://jsfiddle.net/Lbbt1uy8/
What is important to know is that vertical-align uses line-height not height to center something vertically.

Answer 3

Try to use <p> elements instead of </br> on your text and add align attribute to your image like this:
<div class="medium-12 columns"><img src="http://placekitten.com/g/75/90" align="left"/><p>1</p><p>2</p><p>3</p></div>
Here fiddle

Answer 4

you had lots errors on the syntax
and you should wrap each element and assign them with separate CSS codes
HTML:
<div class="medium-12 columns">
<img src="http://placekitten.com/g/75/90"></img>
</div>
<div id="txt">
1<br>2<br>3<br>
</div>
and CSS
.medium-12 {
min-width:75px;
height:90px;
margin-right:30px;
float: left;
display: block;
}
#txt {
float: left;
display: block;
margin-top: 0;
}