WordPress.org

Ready to get started?Download WordPress

Forums

Twenty Twelve
footer background color (6 posts)

  1. zu1u
    Member
    Posted 1 year ago #

    I want to change the footer background color, so that all the footer content is in a box of the same background color. I tried to add the background color as follows:

    .template-front-page.two-sidebars {
    	background: #2c2c2c;
    }

    That however only changes the background color of the single widges in the footer. Also tried adding the background to .widget-area#secondary, that's a div from sidebar-front.php that includes all the footer content, but without success.

    How can I get the background color into the footer the way I want?

  2. Andrew
    Forum Moderator
    Posted 1 year ago #

    Are you using a browser developer tool like Firebug for these sorts of CSS issues?

  3. zu1u
    Member
    Posted 1 year ago #

    yes i use firebug. Is there a feature that allows me to solve this easily? I wouldnt say I'm a firebug expert...

  4. WPyogi
    Volunteer Moderator
    Posted 1 year ago #

    Please post a link to you site for help with CSS questions.

  5. zu1u
    Member
    Posted 1 year ago #

    WPyogi, here is a link to the page:
    http://sometestdomain.comeze.com/

    I managed to get the background color in the footer by now so that it covers all the widgets inside the footer.

    However, no I face the problem that the right part of the footer is being pushed more down than the left part if you use the menu to go to any other page. For me, that problem however only appears in Chrome and not in Firefox. Any ideas how to solve this problem??

  6. zu1u
    Member
    Posted 1 year ago #

    here's the relevant css part that I changed for the coloring of the footer:

    div.front-widgets * h3 {
    		color: #ffffff;
    	}
    
    	.template-front-page.two-sidebars .widget-area .front-widgets {
    		background: #2c2c2c;
    		float: left;
    		width: 60.9375%;
    		margin-bottom: 24px;
    		margin-bottom: 1.714285714rem;
    		height: 17.857142rem;
    		color: #ffffff !important;
    	}
    	.template-front-page .widget-area .widget {
    		padding: 20px 20px 0 20px;
    	}
    	.template-front-page .widget-area .widget:nth-child(odd) {
    		clear: right;
    	}
    	.template-front-page .widget-area .widget:nth-child(even),
    	.template-front-page.two-sidebars .widget-area .front-widgets + .front-widgets {
    		float: right;
    		width: 39.0625%;
    	}

Topic Closed

This topic has been closed to new replies.

About this Theme

About this Topic

Tags

No tags yet.