Jump to content


Photo
- - - - -

White background to the content area ONLY


Best Answer Danny , 02 January 2014 - 11:10 AM

OK, when you said you wanted your sidebar and content area with a white background that is what I thought you meant, if you want both areas to have a white background and have no gap in between use the following CSS:

 

#page-main .pl-content {
background-color: #FFF;
}
 
If that isn't to your taste, try this instead:
 
#pl_areau60e19 .pl-content {
background-color: #FFF;
}
Go to the full post


  • Please log in to reply
9 replies to this topic

#1 jsecore

jsecore

    Advanced Member

  • Members

  • 32 posts
  • Framework Version:latest
  • Country: Country Flag

Posted 28 December 2013 - 09:19 AM

Hey there...How do I keep the page background but just change the color of the background behind the content so it looks boxed.  I don't actually want to activate the boxed feature because that carries, as far as I know, from top to bottom on the page.  I ONLY want it in the content area on a page...so for example on this page

 

www.schutzwhite.com/divorce 

 

I want white behind the text / content area but the white should stop above the simple nav.  Hope that make sense I look forward to your response.  Oh and please answer as if you are explaining this to a 3rd grader lol...

 

 



#2 Danny

Danny

    Is Awesome!

  • Moderators
  • 17666 posts
  • LocationManchester, UK
  • Country: Country Flag

Posted 29 December 2013 - 11:09 AM

Hi,

 

See my reply here, the CSS provided should resolve your issue.

 

http://forum.pagelin...ssues-globally/



#3 jsecore

jsecore

    Advanced Member

  • Members

  • 32 posts
  • Framework Version:latest
  • Country: Country Flag

Posted 29 December 2013 - 09:23 PM

Ok I read through the response but I'm a bit unclear...do I take the code: 

 

#site .thepage {
background-color: lightblue;
}

 

#site .pl-area-wrap {
padding: 0 !important;

 

#site .pl-content {
background-color: #FFF;
}

 

 

and paste it directly into the Custom CSS area?  Do I then call to to those elements specifically in the Styling CSS area?   Now when I do install that code it gives the home page's ENTIRE content area a white background..from the top nav area all the way through the footer...That is NOT the affect I am after...I ONLY want the sidebar widget area and the actual body text area...if you look at link: http://www.schutzwhite.com/divorce I left the result of the CSS code you gave me in place so you could see what it did...This might help you understand what I am trying to accomplish.  The original site's homepage gives you an idea, it's not a WP site, and what I am trying to do is recreate that "look" but with PL DMS...http:schutzwhite.com <---that is the original site / homepage...see how the content has the white-ish background...Thanks in advance!



#4 Danny

Danny

    Is Awesome!

  • Moderators
  • 17666 posts
  • LocationManchester, UK
  • Country: Country Flag

Posted 30 December 2013 - 11:12 AM

OK, well if that is the case, then first of all remove the following:

 

#site .pl-area-wrap {
padding: 0 !important;
 
#site .pl-content {
background-color: #FFF;
}

 

Now you will need to create some custom CSS like so:

 

.mywhite-bg { background-color: white; }

 

Then add that class name to the sections you wish to have a white background, you add the class name to the styling classes field in the sections options. The end result will be this:

 

http://d.pr/i/7JFE

 

You can find more information on styling classes field and how to add different backgrounds in our documentation - http://docs.pageline...on-area-styling



#5 jsecore

jsecore

    Advanced Member

  • Members

  • 32 posts
  • Framework Version:latest
  • Country: Country Flag

Posted 30 December 2013 - 06:57 PM

Danny-

 

Ok thanks for the tip, respectfully, I was able to achieve the white background for the content area like you demonstrated here: http://d.pr/i/7JFE .  I actually got that "look" before I posted here.   My issue with that though is if you look you can see the blue background bleeding through between the two sections.  I don't want that, I want an even background that the content sits so there are no seams.  Does that make sense?  Is that possible or will that require some crazy CSS coding?  Thanks again!!



#6 James B

James B

    Advocate

  • Members

  • 5126 posts
  • LocationSurrey - UK
  • Country: Country Flag

Posted 31 December 2013 - 07:24 AM

Hi there, looks like you've resolved this since the last post, currently shows as http://screencast.com/t/2UCL1MJVt without the bleed. Let us know if you require further assistance.



#7 jsecore

jsecore

    Advanced Member

  • Members

  • 32 posts
  • Framework Version:latest
  • Country: Country Flag

Posted 31 December 2013 - 09:08 PM

James-

 

No not resolved at all...what you saw in the screen cast was NOT what I was looking for...that sets a white background that runs all the way top - bottom of the page...I ONLY want the white background in the content area...The solution that Danny was kind enough to suggest created that seam gap that allowed the bleed through of the background.  So as of right now I do NOT have a solution...



#8 Danny

Danny

    Is Awesome!

  • Moderators
  • 17666 posts
  • LocationManchester, UK
  • Country: Country Flag

Posted 02 January 2014 - 11:10 AM   Best Answer

OK, when you said you wanted your sidebar and content area with a white background that is what I thought you meant, if you want both areas to have a white background and have no gap in between use the following CSS:

 

#page-main .pl-content {
background-color: #FFF;
}
 
If that isn't to your taste, try this instead:
 
#pl_areau60e19 .pl-content {
background-color: #FFF;
}


#9 jsecore

jsecore

    Advanced Member

  • Members

  • 32 posts
  • Framework Version:latest
  • Country: Country Flag

Posted 03 January 2014 - 10:29 AM

That seemed to do the trick!!!  Thanks a ton for all the help.  I really appreciate it!!



#10 Danny

Danny

    Is Awesome!

  • Moderators
  • 17666 posts
  • LocationManchester, UK
  • Country: Country Flag

Posted 03 January 2014 - 12:04 PM

No problem, happy to hear this resolved your issue.