align this to end of last text line

St_Aug_Beach_Bum
St_Aug_Beach_Bum used Ask the Experts™
on
I'm trying to add this code for some social networking buttons.

I would like to have the share buttons appear at the end of the text, inline with the last line.

For some reason though, right now, it moves the last line of text over to the right, and appears to the left of the text. (maybe the source has it align:left?

If I do, float:right  - it goes all the way to the right side of the page. Don't want that. I want it to appear at the end of the last sentence.

Any solutions you know of for this?

Thanks,   Chris
Comment
Watch Question

Do more with

Expert Office
EXPERT OFFICE® is a registered trademark of EXPERTS EXCHANGE®
Do you have a url or code we can look at?

Author

Commented:
Oh boy, that would help, eh?  My excuse is I'm down with a cold right now and wasn't thinking clearly - here it is:

<html>
<body>
<p>This is some sample text to see how this work.</p>

<p>I would like the 'share' display to show up at the end of the text, inline with the last line.</p>

<p>As it is right now, it lines up in front of the last line of text, instead of at the end of the text. It should also break to the next line if there is not enough room for it. </p>

<p>Would a nobr tag do the trick for that, or is there a better way?  <!-- AddThis Button BEGIN -->
<span style="display:inline;" class="addthis_toolbox addthis_default_style ">
<a class="addthis_button_facebook_like" fb:like:layout="button_count"></a>
<a class="addthis_button_tweet"></a>
<a class="addthis_counter addthis_pill_style"></a>
</span>
<script type="text/javascript" src="http://s7.addthis.com/js/250/addthis_widget.js#pubid=ra-4e402a4d44bda65e"></script>
<!-- AddThis Button END -->
</p>
</body>
</html>

Open in new window

Author

Commented:
Originally (the way the button site gave it to me) that's a div instead of a span, but I changed it trying to get it inline -

Chris
Really, if you want to get things inline that don't normally want to be inline, you need to use either divs or a table.  Since there are those that screen "Don't use a table!"  (Why I'll never know), I will show you an example with div's:

<div id="container"><div id="share_text">Would a nobr tag do the trick for that, or is there a better way?</div><div id="share_button"><a class="addthis_button_facebook_like" fb:like:layout="button_count"></a>
<a class="addthis_button_tweet"></a>
<a class="addthis_counter addthis_pill_style"></a>
</div></div>

Your CSS would look something like this:

#container
{
      width: 100%;
}

#share_text
{
     float: left;
}

#share_button
{
     float: left;
}

Do more with

Expert Office
Submit tech questions to Ask the Experts™ at any time to receive solutions, advice, and new ideas from leading industry professionals.

Start 7-Day Free Trial