[Last Call] Learn how to a build a cloud-first strategyRegister Now

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 371
  • Last Modified:

Make ShareThis Button Float

Hello I am using a share this button on my website and would like to make it float vertically as the user moves up and down the content in a page. We have a html site with a Dreweaver template that is connected to all the pages.

Currently the Share this button is on top of the page under the the main header image(banner) and above the drop-down menu ( main negation )  So it is appearing as if it is in a table ( within a cell) and we have an entire section ( cell ) that is showing up as black and is acting as a divider that which we don't want to see.
Here is a link to share this button website. I see it floating on their site. :-)

http://www.sharethis.com/publishers/get-sharing-button
0
netcomp
Asked:
netcomp
  • 3
  • 2
1 Solution
 
Jason C. LevineNo oneCommented:
The code of the button on the sharethis site is irrelevant.  We would need to see it on your site with your code in order to suggest a good solution
0
 
netcompAuthor Commented:
Jason,
Here is the adobe Dreamveaver file that we are using. I have saved it as an HTML file. I hope it helps.
The reason that I wanted it to float vertically was to get rid of the long cell that appears above the css drop-down menu. If you could help me somehow get rid of that cell, I could do without the shareThis buttons floating.  Ideally, I would like to have the Sharthis button, to appear at button right hand corner of the top banner. So the Sharthis button would be in the front of the Head-fin.gif image and on its righ hand bottom corner. This would be as if it was setting on top of the drop-down menu on the right side.  
I have also attached a css file for the drop-down menu just in case you want to see it.


Thank you for your help.
style.css
html.html
0
 
Jason C. LevineNo oneCommented:
Can you give me a link instead?  It's a lot easier to do this with all of the images included...
0
VIDEO: THE CONCERTO CLOUD FOR HEALTHCARE

Modern healthcare requires a modern cloud. View this brief video to understand how the Concerto Cloud for Healthcare can help your organization.

 
gatorlockedCommented:
Hi Netcomp.

Add id="nomove" to the div that holds the facebook/twitter icons. It will look like this:
<div id="nomove" align="right"align="absbottom" usemap="#Map">

Then add these lines to the <style> tag in the header of your HTML file:
#nomove { position:fixed;  
      left:0;
      top:50px;
      z-index: 2000;
}

It should look like this:
<style type="text/css">
<!--
body {
      background-color: #336699;
      background-image: url(../images/BackgroundL7-Large.gif);
}
.style1 {color: #FFFFFF}

#nomove { position:fixed;  
      left:0;
      top:50px;
      z-index: 2000;
}

-->
</style>

Now the icons should float. You can change the values of left and top in order to position it correctly. For instance, you can use left: 1000px and top: 125px to return it back to where it was originally.

Hope this helps.
0
 
netcompAuthor Commented:
Sorry, I forgot all about this. I will try it and get back t you soon. Thank you,
0
 
Jason C. LevineNo oneCommented:
This question has been classified as abandoned and is closed as part of the Cleanup Program. See the recommendation for more details.
0

Featured Post

Prep for the ITIL® Foundation Certification Exam

December’s Course of the Month is now available! Enroll to learn ITIL® Foundation best practices for delivering IT services effectively and efficiently.

  • 3
  • 2
Tackle projects and never again get stuck behind a technical roadblock.
Join Now