Alignment of profile group checkboxes

Hi

I have installed the Social thenme to my buddypress site and since doing so the profile group checkboxes I created are displaying out of alignment with there corresponding title.
This is happening on the BP Profile Search widget and aslo in the standard bp edit profile screen.
I have a screen shot I can send if needed.
Hope someone can help get these aligned properly.

  • Patrick
    • Support Monkey

    Hiya @mark_bonito

    Welcome to the forums!

    I just checked your site and see the problem. The CSS from the Classifieds plugin is overriding that of the profile groups. An easy fix is to add a more specific style rule that affects only those checkboxes. Here's what you'd need to add:

    .widget_bp_profile_search #bps_widget  input[type="checkbox"] {
    width:auto;
    }

    It is recommended to not add custom styles directly to the theme's style-sheet. If you do, you will need to add them in again every time you update the theme. To prevent that, add your custom CSS to the child-theme that comes bundled with the theme download. Then activate the child-theme on your site.

    For more on child-themes, see https://premium.wpmudev.org/manuals/the-buddypress-manual-2/what-are-parent-and-child-themes/

    Hope this helps! And thanks for being a member :slight_smile:

  • mark_bonito
    • Site Builder, Child of Zeus

    Many thanks for the prompt response.

    I just want to check I am doing this right as I have never worked with a child theme before.

    I uploaded the bp-social-child folder to my themes and then network activated it. I then activated the them via my site dashboard.
    All is good, and the site is as I had it before.

    Now I went into the child theme folder and renamed child-style-sample.css to child-style.css
    I then added the code given above to the last line of the child-style.css

    It has not had any effect.

    Have I done everything correct?

    Kind Regards
    Mark

  • Patrick
    • Support Monkey

    Hi again @mark_bonito

    I just checked your site and see that the child-theme is indeed activated and the correct style-sheet is being called.

    Viewing the style-sheet, the problem is the CSS that was added. What program did you use to edit the child-style.php file?

    I ask that because the CSS that was added is corrupted. Open your child-style.php file and you'll see where the quotation marks have been replaced with HTML characters. Simply ensure that the CSS that is saved is exactly as I posted above.

    When editing files/templates, use a text editor like Notepadd++
    http://notepad-plus-plus.org/

  • Patrick
    • Support Monkey

    @mark_bonito

    You're welcome!

    Dreamweaver and other editors (like MS-Word) should be avoided when editing code because they invariably add formatting, or corrupt things like you just experienced.

    Glad things worked out :slight_smile:

    I'm going to go ahead and mark this thread as resolved. But if you still need more help on this, simply re-open the thread by ticking the Mark as Not Resolved (re-open) box below.

  • Patrick
    • Support Monkey

    Hi again @mark_bonito

    Yes, on the registration page, those checkboxes are actually in the profile details form and have different IDs/classes assigned to them. To fix that form, change the code I gave you above to this:

    .widget_bp_profile_search #bps_widget  input[type="checkbox"], #profile-details-section .editfield input, #profile-details-section .editfield textarea, #profile-details-section .editfield select {
    width:auto;
    }

Thank NAME, for their help.

Let NAME know exactly why they deserved these points.

Gift a custom amount of points.