WordPress.org

Ready to get started?Download WordPress

Forums

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

  1. alexhartley13
    Member
    Posted 1 year 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 1 year ago #

    I am using picolight theme by the way

  3. kasal
    Member
    Plugin Author

    Posted 1 year 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 1 year 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 1 year 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 1 year 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 1 year 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 1 year 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 1 year ago #

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

Topic Closed

This topic has been closed to new replies.

About this Plugin

About this Topic

Tags