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.
精彩评论