2016-12-21 56 views
0

我试着从左边和右边浮动代码,也从左和右对齐它,但它不会像文本或悬停图像一样留在同一行上另一个。我有点困惑我做错了什么,你们可以帮我吗?把html悬停在右边,而在右边添加文字

的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; 
} 
+0

放在右jfiddle,是我不好。 –

+1

很难理解你想要完成什么。你想在一边看到图像,在另一边看到文字,而不是现在的样子? –

+1

请正确格式化您的代码 - 很难阅读 – ochi

回答

2

.left内联块的显示器和一个固定的宽度。

像这样:

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

小提琴:http://jsfiddle.net/W3Pxv/348/

+0

完美,谢谢! –

+0

@AntonioVallez请标记为已修复您的问题,如果它帮助你:) –