WordPress.org

Forums

Hupso Share Buttons for Twitter, Facebook & Google+
[resolved] share buttons not aligned properly (9 posts)

  1. alexhartley13
    Member
    Posted 2 years ago #

    Somehow the share buttons are not aligned properly. See screenshot. How can I make them appear in one row? Thanks

    http://wordpress.org/extend/plugins/hupso-share-buttons-for-twitter-facebook-google/

  2. alexhartley13
    Member
    Posted 2 years ago #

    I am using picolight theme by the way

  3. kasal
    Member
    Plugin Author

    Posted 2 years ago #

    Add this to your CSS:

    .fb-like.fb_edge_widget_with_comment.fb_iframe_widget {
        margin-top: 0px !important;
    }

    Perhaps you will have to use negative margin.

    Does this solve your problem?

  4. kasal
    Member
    Plugin Author

    Posted 2 years ago #

    There is a better way.

    Add this to your CSS:
    .hupso_twitter {
    	margin-top: -20px !important;
    }
    .hupso_facebook {
    	margin-top: -20px !important;
    }

    Change -20px to such value that buttons will be aligned properly.

    Let me know if this works.

  5. alexhartley13
    Member
    Posted 2 years ago #

    Thank you. I'll try that when I get back home this afternoon and let you konw. I am not very savvy with CSS and HTML code though, is there a specific place where I add that code?

    Thanks

  6. kasal
    Member
    Plugin Author

    Posted 2 years ago #

    You can add it at the end of style.css in your theme:
    WP Admin->Appearance->Editor->style.css

    Click on "Update file" button at the bottom to save changes.

  7. alexhartley13
    Member
    Posted 2 years ago #

    Ok, it looks like we are making some progress....

    http://www.flickr.com/photos/73313384@N04/8623006692/in/photostream

    I changed the value around and I found that at -25, twitter and facebook were aligned with the other ones, but now it is overlapping google and pinterest. any suggestion?

    Thank you for your prompt response.

  8. kasal
    Member
    Plugin Author

    Posted 2 years ago #

    You can do similar for Google and Pinterest.
    Just set margin-left and margin-right:

    .hupso_google {
    	margin-left: 20px !important;
    	margin-right: 20px !important;
    }
    .hupso_pinterest {
    	margin-left: 20px !important;
    	margin-right: 20px !important;
    }
  9. alexhartley13
    Member
    Posted 2 years ago #

    got it fixed. thank you for your help :-)

Topic Closed

This topic has been closed to new replies.

About this Plugin

  • Hupso Share Buttons for Twitter, Facebook & Google+
  • Frequently Asked Questions
  • Support Threads
  • Reviews

About this Topic

Tags