How do I correctly document this in CSS?

Posted on 2014-08-18
Last Modified: 2014-08-18
Head out to

I'm putting together a Wordpress site for my client and I want to have a white area for the content, but only the content.

In other words, the background color of the body needs to be black. But where I have text needs to be white.

Using Firebug, I was able to locate the precise location where I want to make my change. The CSS looks like this:

<body class="home blog" itemtype="" itemscope="itemscope">
<div class="full-background">
<div class="body_wraper_box">
<header class="header-wraper">
<section id="contents" class="clearfix">
<div class="row main_content">
<div class="container content_wraper">

It's in "section id="contents" class="clear fix" - that's where I need to make by background color white.

So I head out to the css file and I can't find "contents." So I write:

#contents {
background: #fff;

...and nothing.

I'm poised on the threshold of great things, here, I know it. But I can't make the change and I don't know why.

What am I missing?
Question by:brucegust
    LVL 58

    Accepted Solution

    Didn't I already give you the code for this in another question?

    You probably want to add some padding to this
    .container.content_wraper {
        background: #fff;

    Open in new window

    LVL 16

    Expert Comment

    by:Joshua Grantom
    the issue is that section id="contents" gets its black background color from .body_wraper_box

    Unless you change the html code of the template you will not be able to do this.

    I believe he wants the entire bottom below header-wraper to be white, not just the inside content wrapper

    Author Comment

    Gary, you did give me some code but the problem was that what I asked for didn't do the trick in that in order for my header and menu to look seamless, I had to have more than just a border. But since that's what I asked for, I gave you the credit and closed the question.

    Let me try this new suggestion of yours and see if that doesn't ring the bell.
    LVL 16

    Assisted Solution

    by:Joshua Grantom
    try changing

    .body_wraper_box {
        background:  #FFF;

    and adding

    .header-wraper {
    background: #000;
    padding: 0 0 10px 0;
    LVL 16

    Expert Comment

    by:Joshua Grantom
    the above code does this, just choose your padding for the bottom of header-wraper


    Author Comment

    Gary, your suggestion worked! That will do it!

    Write Comment

    Please enter a first name

    Please enter a last name

    We will never share this with anyone.

    Featured Post

    How to improve team productivity

    Quip adds documents, spreadsheets, and tasklists to your Slack experience
    - Elevate ideas to Quip docs
    - Share Quip docs in Slack
    - Get notified of changes to your docs
    - Available on iOS/Android/Desktop/Web
    - Online/Offline

    When writing CSS, there are a few simple rules that will make your life easier.    1. Using ‘* {box-sizing:border-box;}’. Using this will wrap all your elements in a nice little compact box-model that will give you the width you want, like so... …
    CSS is a visual language used to classify objects and define rules about how they should be displayed. CSS skills aren’t restricted to developers anymore, there is a big benefit to having a basic understanding of the language, regardless of your occ…
    In this Micro Tutorial users will learn how to embed custom fonts into websites using @font-face in CSS Select a font: Ensure the EULA allows you to use @font-face: Download the font: Get the browser-compatible files you need: Edit your CSS       - Name …
    In this Micro Tutorial viewers will learn how to create a CSS image sprite (In a later tutorial, viewers will learn how to use CSS and HTML to create a navigation menu using this sprite) Open a new Photoshop document with a width of (Icon width)x(N…

    758 members asked questions and received personalized solutions in the past 7 days.

    Join the community of 500,000 technology professionals and ask your questions.

    Join & Ask a Question

    Need Help in Real-Time?

    Connect with top rated Experts

    13 Experts available now in Live!

    Get 1:1 Help Now