Ввод html hover справа при добавлении текста справа

Question

Я пробовал плавать код слева и справа, а также переписывать его слева и справа, но он не остается на той же строке, что и текст, или парящее изображение выше другой. Я немного смущен тем, что я делаю неправильно, не могли бы вы, ребята, помочь мне?

JsFiddle: http://jsfiddle.net/W3Pxv/344/

<span class="right"><a href="http://discord.me/animalcrossingchat"><img src="http://i.imgur.com/1HcjGUB.png?1" onmouseover="this.src='http://i.imgur.com/Y3qUfNt.png?1'" onmouseout="this.src='http://i.imgur.com/1HcjGUB.png?1'" /></a></span><span class="left">Animal Crossing Community gives you an unlimited amount of possibilities. Do you want to share some unforgettable moments of your own animal crossing experience or just talk about anything noteworthy that comes to your mind on our plaza? Why don't you grab a cup of coffee and talk about more serious matters in the roost? Become a premium member and enjoy a variety of new features and much more. 

Be part of our community by earning bells, answering the question of the day or winning valuable prices on our server's contests. You are what you make yourself to be on Animal Crossing Community. Join today and become the newest member.</span> 

Css:

.right { 
    float:right; 
} 

.left { 
    float:left; 
} 

Answer 1

Дайте .left отображение инлайн-блока и фиксированную ширину.

Как так:

.left{ 
    width: 420px; // size is interchangable 
    display: inline-block; 
    float:left; 
} 

Fiddle: http://jsfiddle.net/W3Pxv/348/