开发者

Have two buttons on the same line

I would like to have both the "email me" button on the same line as the "skype" button. I am new to HTML so go easy on me.

The code is

<!-- emailme Button BEGIN -->
<div id="emailme_div1"></div>
<script>var emailme_id=4714;</script>
<script type="text/javascript" src="http://static.emailmebutton.com/emailme.js"></script>
<!-- emailme Button END -->
<!--Skype 'Skype Me™!' button Begin-->
<a href="skype:grapplerulrich?call"><img src="http://mystatus.skype.com/bigclassic/grapplerulrich" style="border: none;" width="182" height="44" alt="My status" /></a>开发者_运维问答
<!--Skype 'Skype Me™!' button End-->


You have to position them relative and use "float:left" to get them next to eachother. The best way is to put both buttons inside a "container" and then asign both buttons position:relative and float:left

Here you go: http://jsfiddle.net/cLEFW/

I've wrapped a div around youre skype script, and added the position:relative and the float:left. In fact, you dont even need to use position:relative, but well... I've done it anyway xD


You should float each button.

Give them a set width to space them apart properly.

Add some margin-top to the first button to line them up vertically.

#emailme_div1{float:left; width:150px; margin-top:9px;}
#skype{float:left;width:150px;}

http://jsfiddle.net/jasongennaro/mn8EZ/

Note: this requires adding an id to the skype a href.

BTW: you will need to clear the floats for any content underneath.

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜