Skip to:

With BP Followers the buttons overlap on the members screen: please help!

  • Avatar of Donald McIntyre
    Donald McIntyre


    Hello! The plugin is great! but it is doing something I´m trying to correct. The buttons overlap on the Members screen! How can I upload a screenshot?

    OK, I tried sepparating them using this in the style.css:

    Hey masonjames!

    I tried sepparating the buttons using the child theme style.css, but it didn´t work. I think changing something in the code you gave me might work, we are very near a solution. The code you gave me is:

    ul.item-list li div.action { top: 0px; }
    .generic-button { margin: 20px, 0px }

    But it doesn´t work. I´n using a child theme of the BP Social Theme of WPMU DEV and they told me to talk to the plugin´s developer, so here I am!!

    Thank you, Donald.

Viewing 10 replies - 1 through 10 (of 10 total)
  • Avatar of @mercime


    @donmcint create a testuser account and post username and password here so we could help you. You can easily delete testuser account after issue is resolved.

    I’ve created a child theme to help with this problem. You can download it here:

    Avatar of r-a-y


    I wrote about this issue in a previous post:

    You’re right that the buttons overlap in the directory. I was thinking of adding some inline CSS to the plugin, but thought it’s more of a general bp-default theme issue. I felt that it should be easy enough for theme devs to add a few lines of CSS themselves.

    If enough people request it, I will add some inline CSS to the plugin so it will at least look good in bp-default. Can’t say the same for 3rd-party themes though.

    Avatar of valuser


    Many thanks for the plugin.

    Have used a variation of a previous post in this thread (in a 3rd-party theme). Seems to work to prevent overlapping with Friends.

    ‘ul.item-list li div.action {
    top: 18px;
    ul.item-list li div.action.follow {
    position: relative;
    top: 18px;

    ul.item-list li div.action.unfollow {
    position: relative;
    top: 1px;

    .friendship-button {
    margin-bottom: 18px;

    .friendship-button.pending {
    margin-bottom: 18px;

    Avatar of cleantesophras


    Failure does not mean I have accomplished nothing; It does mean I have learned something

    Avatar of blogsterfiles


    “If enough people request it, I will add some inline CSS to the plugin so it will at least look good in bp-default. Can’t say the same for 3rd-party themes though.”

    This would be great! Is this where we “request it”? Thanks!

    Avatar of BlinkyBill01


    @valuser thanks for supplying that bit of code. Worked perfectly for me in my RocketTheme theme!

    Avatar of blogsterfiles


    I’m using bp-default. I created a child theme and simply added the code above (thank you @valuser ) to the child theme’s style.css and it worked perfectly. Many thanks to @apeatling and @r-a-y for this great plugin! This is such a cool plugin and everything is so great now with the bp-default theme I still think it would be a great idea if the plugin and bp-default worked together right out of the box. Either way, I’m a happy camper, so thanks again!!

    Hello I applied the child theme for bp-default and it works. Unfortunatelly I cannot fix this bug for BuddyPress mobile. Any idea?

    Avatar of inkblot


    Just to share a very current fix (post-BuddyPress 1.6 update using BP-Default theme along with custom child theme) for this problem. Our senior developer placed the following in our child theme (style.css), and it fixed this very simple (non-mobile – but it may work coupled with BuddyPress Mobile) glitch with the overlap of the buttons;

    `/* Fix overlapping buttons */
    div .action .friendship-button {
    margin-top: 4px;
    margin-bottom: 18px;

    And there you have it!

Viewing 10 replies - 1 through 10 (of 10 total)

You must be logged in to reply to this topic.