Skip to:
Content
Pages
Categories
Search
Top
Bottom

Styling Group and Members Headers

  • Avatar of hughshields
    hughshields
    Participant

    @hughshields

    I am trying to increase the width of the Group header description using CSS but it is the same ID as the Profile header description so it extends the profile description field also and is creating conflicts with the side-bar. I am using:

    #item-header-content {width: 120%;}

    I tried dropping in a new class into the <div> in my childtheme/groups/single/group-header.php file:

    <div id=”item-header-content” class=”mygroupcss”>

    I then tried styling the new class but it doesn’t work:

    .mygroupcss {width: 120%;}

    Any ideas or help is much appreciated!

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

    @mercime

    @hughshields BP generates the “groups” body class for all groups pages. So just add .groups before the element in your stylesheet for example:
    .groups #item-header-content {
    color: #000033;
    }

    Avatar of hughshields
    hughshields
    Participant

    @hughshields

    Thanks for the tip. I included your CSS in my theme style sheet and it works, but it throws off the styling for my theme (suffusion) and puts 5-6 blank lines at the top of the group header.
    I believe this is an issue with my theme’s template pack which is outdated since Buddypress 1.8.1.
    I will try and resolve this on the Suffusion forum.
    Thanks
    Hugh

    Avatar of @mercime
    @mercime
    Keymaster

    @mercime

    puts 5-6 blank lines at the top of the group header

    @hughshields you can always add negative top margin to correct the issue, like:
    .groups #item-header-content {
    margin-top: -20px;
    }

    Avatar of hughshields
    hughshields
    Participant

    @hughshields

    Thanks for that tip also. It seems the margin is only appearing in IE 10 browser for some reason. It works fine in Firefox and Chrome and there is no unwanted margin with the Buddypress Default theme. I even deleted out the suffusion buddypress template pack group-header-php so that it would revert to the theme default and the margin is still there but only in IE.

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

You must be logged in to reply to this topic.