Support » Fixing WordPress » Remove Background Color in Widgets Below Header and Above Footer – Suffusion

  • Resolved picneewatch


    I have posed this question before but have yet to receive a response.

    I am new to WP and Suffusion, and would like to know how to remove/change the background colour of the widgets below header and above the footer (i.e. ad placements). Though I have attempted to implement suggestions of some commentators, I am still coming up short.

    Any assistance would be greatly appreciated.



Viewing 10 replies - 1 through 10 (of 10 total)
  • Have you checked out Suffusion’s dedicated forums here:

    Thanks for a reply WPyogi.

    Yep, my first stop was the above forum. No luck there! I came over here and saw some earlier posts that I thought I could implement something from, but again, nothing. Any other suggestions would be greatly appreciated. To be honest, I’m sure it is a little thing, but for a novice, it seems like a biggie.

    Thanks in advance.

    The two areas with the ad widgets are:

    #horizontal-outer-widgets-1, #horizontal-outer-widgets-2 {
        display: inline-block;
        float: left;
        padding: 10px 0;
        text-align: center;
        width: 100%;

    What gives them their white background is:

    .flattened {
        background-color: #FFFFFF;
        border: 1px solid #C0C0C0;

    Do not alter your theme’s CSS.
    You should use a Child Theme or a Custom CSS plugin to make the changes –

    If you use Firefox, get Firebug to see the underlying code of your site –

    You know, I’m really not at all familiar with that theme, so this may or may not be the ideal solution and it may change things in other places. That said, try adding this to custom CSS:

    .dbx-content {
        background-color: #xxxxxx;

    Obviously, use the color you want.

    Really, I know Sayontan provides great support on his forum, so I’d strongly suggest using it…

    Go to Suffusion Options → Back-end → Custom Includes → Custom Styles, and put this in:

    #horizontal-outer-widgets-1 { background: none; }

    Your options will remain safe through upgrades if you put the CSS in this location.

    Thanks everyone for taking the time to assisting me with my query.

    Sayontan, if I need the background of the widgets (below header/above footer)to be the same as background, should I substitute “none” in the above code to the colour of choice?


    Again, thanks you guys!

    Sayontan, I implemented the above changes, and there is progress (yay!), but how do I get rid of the line/border around the widget below the header? Also, what code would I use for the widget above the footer? Is it possible to centre the widgets for both – below header and above footer?

    Thanks in advance.

    Sayontan, as of yet, I have been able to remove the white colour background of both widgets – below header and above footer, but yet to fully remove the white line/border around the said widgets. Any suggestions as to how to do this? Also, any suggestions on how to centre the ads?


    For the record, was able to resolve the background/border issues. The following was implemented:

    #horizontal-outer-widgets-1 { background: none; border: none; }
    #horizontal-outer-widgets-2 { background: none; border: none; }

    Thanks everyone!

    Sidebar: Any suggestions for centering the ads (widget below header/ widget above footer)?

    Thanks in advance.

    Everything has been resolved! Thanks everyone for the help.


Viewing 10 replies - 1 through 10 (of 10 total)
  • The topic ‘Remove Background Color in Widgets Below Header and Above Footer – Suffusion’ is closed to new replies.