Background color on text area in pages

lindsaylarner · Member · Apr 22, 2014 at 9:35 pm
Copy link

Add topic to favorites
I am using the Publisher theme, and I am looking for the CSS code to change the background color of the box where the text is on my pages.

Example page is: http://meetcutemonologues.com/prologue/about-the-ideologue/

The blog I need help with is: (visible only to logged in users)
thesacredpath · Member · Apr 22, 2014 at 9:52 pm
Copy link
This will allow you to change the background color on the content area site wide (posts and pages).
```
#content {
background: #FFFFFF;
}
```
If you wish to have different colors on different pages, then you would need to use the unique page body class for that individual page. In the example of the About the Idealogue page, it would look like this:
```
.page-id-216 #content {
background: #FFFFFF;
}
```
You can find the unique page body classes for individual pages by visting that page and then viewing the source code (browser view menu) and in the opening body tag, you will see something that starts like this:

<body class="page page-id-216...

The unique page body selector for this particular page is

page-id-216

Since it is a css Class, you would precede it in the CSS with a period (.) such as this:

.page-id-216 #content
lindsaylarner · Member · Apr 22, 2014 at 10:00 pm
Copy link
Thank you! However, when I use the #content code, it doesn’t fill in the entire box. There is still a white strip around the header. I tried filling in the header by adding a background color, but even then there is still white space. Is there a code that can get the whole box?
lindsaylarner · Member · Apr 22, 2014 at 10:03 pm
Copy link
Just found it using .entry-header. Thanks so much for your help.
thesacredpath · Member · Apr 22, 2014 at 11:02 pm
Copy link
Hooray! Glad you found that. You are welcome and if you have further questions, please let us know.
prunussweet · Member · May 23, 2014 at 2:04 pm
Copy link
how would you change the color on the side bar widget? I just used the first code you gave and it changed the text background to white, matching the menu background (which is what I want). I would like to do the same thing to my Contact Info widget. Also, is there any way to get ride of the small border surrounding the menu text and widget?
timethief · Member · May 23, 2014 at 2:07 pm
Copy link
@prunussweet
All CSS editing is theme specific editing and you are using a different theme. Please use this link https://en.forums.wordpress.com/forum/css-customization#postform to copy and paste your text into a new thread that will appear in the CSS Forum where you will get the help you need.
prunussweet · Member · May 23, 2014 at 2:13 pm
Copy link
Ok, I actually have the same question, along with a couple others posted in the CSS forum. However, this thread seemed to answer one of those questions so I thought I would throw it on here as well.

No items found.