Three images in one line

HTML & CSS
1

I cannot understand why these won`t align correctly in one line. What would be the best solution to have them in one line and spaced evenly?

<a href=“http://mixi.jp/share.pl” class=“mixi-check-button” style=“width:100px;”>Check</a>
<script type=“text/javascript” src=“http://static.mixi.jp/js/share.js”></script>

<iframe allowtransparency=“true” frameborder=“0” scrolling=“no”
src=“http://platform.twitter.com/widgets/tweet_button.html” data-count=“none”
style=“width:75px; height:20px;”></iframe>

<iframe id=“fblike” src=“http://www.facebook.com/plugins/like.php?href=,?php the_permalink()?>&layout=button_count&show_faces=true&width=100&action=like&colorscheme=light” scrolling=“no” allowTransparency=“true” style=“border:none; width=100px; height:20px”></iframe>
</iframe>

2

You haven’t got any images there - that might be a problem. Why do you need iframes there? A much better way would be to create or reference the actual images, rather than all that iframe junk…

3

Hi,

Float them and then use a margin to separate them. remove the inline styling and apply it via the elements class. Ensure you give the element the required dimensions.

(They are all actually inline by default anyway and line up horizontally except that you can’t give a width to the anchor because it’s an inline element.)

4

Thank you! I experimented with the iframes, took out twitter`s iframe, kept the iframe for facebook (it requires it), put them in divs, floated the divs, and I got it to align.

Have a great weekend!