Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 2 of 2
  1. #1
    New Coder
    Join Date
    Jul 2013
    Posts
    80
    Thanks
    40
    Thanked 0 Times in 0 Posts

    Question How can I center my "+1" tweet" etc. buttons in my footer?

    I'm trying to center the three "tweet, follow, +1" buttons on my page. They are currently shown on the bottom left. I am trying to center them between my "" text and the other social links on the left. So far I can't get the darn things to move.

    I currently have:



    Code:
    .footerTweet { position: relative; text-align:center; align:center;}
    .footerFollow { position: relative; text-align:center; align:center;}
    .footerPlus { display:inline; text-align:center; align:center;}


    Code:
    <div class="footerTweet">
    <a href="https://twitter.com/share" class="twitter-share-button" data-url="http://jeffreydowellphotography.com" data-text="Check out --&gt;" data-via="JDP_911">Tweet</a>
    <script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+'://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js,fjs);}}(document, 'script', 'twitter-wjs');</script>
    </div>
    
    
    <div class="footerFollow">
    <a href="https://twitter.com/JDP_911" class="twitter-follow-button" data-show-count="false">Follow @JDP_911</a>
    <script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+'://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js,fjs);}}(document, 'script', 'twitter-wjs');</script>
    </div>
    
    
    <div class="footerPlus">
    <div class="g-plusone" data-size="medium"></div>
    
    <!-- Place this tag after the last +1 button tag. -->
    <script type="text/javascript">
      (function() {
        var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true;
        po.src = 'https://apis.google.com/js/plusone.js';
        var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s);
      })();
    </script>
    </div>

  • #2
    Regular Coder Nerevarine's Avatar
    Join Date
    Jan 2013
    Location
    Phendrana Drifts, Tallon IV, W-Class
    Posts
    283
    Thanks
    0
    Thanked 17 Times in 17 Posts
    Blog Entries
    3
    You have multiple classes affecting singular elements. For example;
    Code:
    <div class="footerPlus">
    <div class="g-plusone" data-size="medium"></div>
    You have both
    Code:
    g-plusone
    and
    Code:
    footerPlus
    affecting the same element. This can have an overriding effect on what you are trying to achieve. Try combining them into one class. You'll see if you have any repeated values that are messing with it.

    Sorry for the late reply.
    Time kills us in our sleep and we watch it happen in our dreams. -K.K.
    THE END-ALL PROGRAMMING REFERENCE: CLICK HERE (Courtesy of Major Payne)
    My username was previously L0adOpt1c. :: Please read this before posting in the HTML/CSS forum.
    Validate your HTML here and your CSS here. :: Need basic HTML/CSS tutorials? Click here, don't post about it.


  •  

    Tags for this Thread

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •