Archived

This topic is now archived and is closed to further replies.

  • 0

Resolved Website having two background colors


Question

Posted · Report post

I have been trying so that my site have two background colors. The content will have white, while either the sidebars or the margin have another color. On PageLines Layout Editor I have customized so that the content area is 1148px, so it is space for margin. But when I use Firebug I can't find any margin css code.

So I tried to give the sidebars background color instead. I saw that on Firebug my sites name for the class for the sidebars are two-sidebar-center. So on custom code I added the code:

#two-sidebar-center {

background-color: #6BB99A;

}

Nothing happened. What is missing? Am I on the right direction or am I lost?

My site is http://www.sailubju.com/blog/

Share this post


Link to post
Share on other sites

7 answers to this question

Posted · Report post

It worked perfect :) Thank you!

Share this post


Link to post
Share on other sites

Posted · Report post

Hi

Please try for example:

ul.sidebar_widgets { background: #6BB99A;}

Use "background" NO "background-color"

Share this post


Link to post
Share on other sites

Posted · Report post

It worked, thank you :)

Where am I suppose to use "background" NO "background-color" ?

The sidebars though are not completely to the edge, what can I do to move the sidebars to the edges of the site. Would it also be difficult to you add background color to the margin instead?

Share this post


Link to post
Share on other sites

Posted · Report post

Hi there, I'm glad Batman's solution worked for you. In order to get the sidebar to move right to the edge of the page you'll need to take the padding out of the content-pad on the left.


#content .content-pad {

    padding-left: 0;

}

Share this post


Link to post
Share on other sites

Posted · Report post

James B, I added the code and the sidebars moved closer to the edge but not completely. Is there something more I need to do?

I appreciate all the help

Share this post


Link to post
Share on other sites

Posted · Report post

Hi

You can try with


body.fixed_width #page, body.fixed_width #footer, body.canvas .page-canvas {

width: 100%;}

I said you background for your first code

#two-sidebar-center {

background-color: #6BB99A;

}

:)

Share this post


Link to post
Share on other sites

Posted · Report post

The topic was marked as resolved.

Share this post


Link to post
Share on other sites