Need help? Check out our Support site, then


Add white background to the main content area

  1. Hello,
    I'd like to add a white box around the main content area in my blog like this http://prebabyblog.com/

    I'm so new to CSS and I have gone through the tutorials but can't figure it out. I just want the content area to have a white background so you can read the text better. My blog is hellobellygoodbyefeet.com

    Thank you!

    The blog I need help with is hellobellygoodbyefeet.com.

  2. See if this is what you want. In this I made the background of your content areas white with a black font color. Just change the second color to whatever color you want.

    #content {background-color: #fff;}
    #content .post-entry {color: #000;}
  3. oops. now it doesn't seem to be creating the background color. Sorry, let me check it again.

  4. It is correct. Check it out and see if it looks like you want it to or if it has created any oddities. I see you have made your font color white, so maybe you are happy with that solution.

  5. Thank you so much!! That is exactly what I was looking for! However, there is a small part of the date that isn't white. How do I fix that?
    http://www.hellobellygoodbyefeet.com

  6. Actually, is there a way for the white background to just go around the content area? Leave the tags and date to the left with the blue background?

  7. Could you remove what we put in before and use this to see if it will turn the area white that you want white?

    #content .post-entry {background-color: #fff;}

  8. It doesn't seem to cover the entire content area. The left side is a bit short and some of the pictures hang over the edge. Also, is there a way to include the title of the post without the date?

    Thank you so much for your help.

  9. Oh dear, I had hoped that would do it. To keep the date from displaying:

    .post-date {display: none;}

  10. I'm sorry, I don't think I'm being very clear. I want the date to appear just not included in the white background. I want the "These are a few of my favorite things" and the content of the post to have a white background. Nothing else.

    Thanks again for your time. I really appreciate it.

  11. i cannot see a way to exclude the date from the white background. It seems to be a part of the block that includes the title. I did enlarge the left margin a bit for the white box behind the text of the article. I included the Title with a white background. That one extends over to the left over the date and I have made it readable on the white background.

    #content .post-entry {background-color: #fff;}
    #content .post-entry {color: #000 !important;}
    .post-entry {padding: 20px;}
    .post-title h1 {background-color: #fff;}
    .post-date * {
    	display: block;
    	padding: 0 15px;
    	position: relative;
            background-color: #fff !important; color:#000;}

    or a slight variation:

    #content .post-entry {background-color: #fff;}
    #content .post-entry {color: #000 !important;}
    .post-entry {padding: 20px;}
    .post-title {background-color: #fff;}
    .post-date * {
    	display: block;
    	padding: 0 15px;
    	position: relative;
            background-color: #fff !important; color:#000;}

    Look at these and see if one is tolerable.

  12. Perfect!! Thank you, thank you, thank you!!

  13. Whew!

Topic Closed

This topic has been closed to new replies.

About this Topic