Place both links on the same line.

How can I have both the Twitter and the "Compartir" (Share in Englsh) link that appears below it; instead, have it diesplay on the same line.  Twitter left justified and "Compartir" right justified.

Also, is there a "Share"  icon that matches better with the site.  The red might stand out too much.

Thanks,
JP
easycapitalAsked:
Who is Participating?

Improve company productivity with a Business Account.Sign Up

x
 
brdavsConnect With a Mentor Commented:
Without the skype link:

<a href="http://twitter.com/share" class="twitter-share-button" data-count="horizontal">Tweet</a>
<script type="text/javascript" src="http://platform.twitter.com/widgets.js"></script>

<a href="http://www.addthis.com/bookmark.php?v=250&amp;pubid=xa-4d86249b41d2ea6e" class="addthis_button_compact">Compartir</a>
<script type="text/javascript" src="http://s7.addthis.com/js/250/addthis_widget.js#pubid=xa-4d86249b41d2ea6e"></script>

Open in new window

0
 
brdavsCommented:
This (without CSS) make both appear on the same line:
<a id="twitter-link" href="#">Twitter</a> <a id="share-link" href="#">Compartir</a>

Open in new window


This CSS will make them go in separate lines:
a { display: block; }

Open in new window


This will make them appear in the same line, first justified to the left and the second to the right.
a { display: block; }
a#twitter-link { float: left; }
a#share-link { float: right; }

Open in new window


By the way. You have not given us enough data to help you with. You should show us a page with the problem and we'd solve it.

Best regards!
0
 
easycapitalAuthor Commented:
Could you see why the page displays the code?

Thanks,
JP
0
Get 10% Off Your First Squarespace Website

Ready to showcase your work, publish content or promote your business online? With Squarespace’s award-winning templates and 24/7 customer service, getting started is simple. Head to Squarespace.com and use offer code ‘EXPERTS’ to get 10% off your first purchase.

 
brdavsCommented:
I do not understand the question. I cannot see the page because you have not given me the URL. It would be easier for me to help you with the problem.

Best regards.
0
 
easycapitalAuthor Commented:
0
 
brdavsCommented:
Argh!
Sorry, but you cannot paste stylesheets into your HTML.

Now for the hard part. Your HTML is not very nice in this widget. It's actualy not stylable as it has in-line styling there. You have a tweeter link hanging alone and a "Compartir" button inside a division (<div class="addthis_toolbox addthis_default_style ">
).

Can you get rid of that division, so you get 3 clear links (twitter, compartir and skype) inside a widget?
This will make all 3 links alingn inline.

Best regards.
0
 
easycapitalAuthor Commented:
A bit rusty.  Could you please indicate how it should be written?

I got rid of the div you mentioned above.

JP
a { display: block; }
a#twitter-link { float: left; }
a#share-link { float: right; }

<a href="http://twitter.com/share" class="twitter-share-button" data-count="horizontal" style="float: left;">Tweet</a><script type="text/javascript" src="http://platform.twitter.com/widgets.js"></script>

<!-- AddThis Button BEGIN Share Compartir -->

<a href="http://www.addthis.com/bookmark.php?v=250&amp;pubid=xa-4d86249b41d2ea6e" class="addthis_button_compact">Compartir</a>
<script type="text/javascript" src="http://s7.addthis.com/js/250/addthis_widget.js#pubid=xa-4d86249b41d2ea6e"></script>
<!-- AddThis Button END -->

Open in new window

0
 
brdavsCommented:
Start like this:

<a href="http://twitter.com/share" class="twitter-share-button" data-count="horizontal">Tweet</a>
<script type="text/javascript" src="http://platform.twitter.com/widgets.js"></script>

<a href="http://www.addthis.com/bookmark.php?v=250&amp;pubid=xa-4d86249b41d2ea6e" class="addthis_button_compact">Compartir</a>
<script type="text/javascript" src="http://s7.addthis.com/js/250/addthis_widget.js#pubid=xa-4d86249b41d2ea6e"></script>

<script type="text/javascript" src="http://download.skype.com/share/skypebuttons/js/skypeCheck.js"></script>
<a href="skype:easycapital?call">
  <img src="http://download.skype.com/share/skypebuttons/buttons/call_blue_transparent_34x34.png" style="border: none;" width="34" height="34" alt="Skype Me&#8482;!" />
</a>

Then if it seems wierd, we can style it using stylesheets.

Open in new window

0
 
easycapitalAuthor Commented:
Ok.  Just for Twitter and Add This, how do I add the code for html. (I removed Skype).

<a id="twitter-link" href="#">Twitter</a> <a id="share-link" href="#">Compartir</a>

Thanks,
JP
0
 
easycapitalAuthor Commented:
Brdavs:

Could you please take a look at the page, because the Twitter link should be left justified and the "Compartir" button right justified.  Please see the top right of the page. This reflects the code you mention above.
<a href="http://twitter.com/share" class="twitter-share-button" data-count="horizontal">Tweet</a>
<script type="text/javascript" src="http://platform.twitter.com/widgets.js"></script>

<a href="http://www.addthis.com/bookmark.php?v=250&amp;pubid=xa-4d86249b41d2ea6e" class="addthis_button_compact">Compartir</a>
<script type="text/javascript" src="http://s7.addthis.com/js/250/addthis_widget.js#pubid=xa-4d86249b41d2ea6e"></script>

Open in new window

0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.