where to change the content background [SOLVED]

[biliousfrog]

I've nearly finished modifying the standard template & stylesheets for my site but I'm completely stumped with one final thing....how can I change the background of the main content text area?

If you head over to my site: www.biliousfrog.co.uk you'll see that the news section has a lighter background (#cccccc) than the main page. I would like to have this colour under the text of the main content but my efforts to change it have fallen flat on their backsides...either changing the entire page background, changing the content plus the header & the links underneath or changing a horizontal strip from the navigation across the page 

I assume that it is possible as there must be a content area for just the text to be placed?

[Dee]

In your CSS add a background definition for the :

Code: Select all

div#main {
   margin-left: 29%; /* this will give room for sidebar to be on the left side, make sure this space is bigger than sidebar width */
   margin-right: 2%; /* and some air on the right */
   background: #999999;
}

Regards,
D

[biliousfrog]

I had already tried that, the problem is that the background colour also covers the page title & the links underneath...is there any way to just change the colour of the updateable content... the text area?

here's the result: http://www.biliousfrog.co.uk/

Steve

[RonnyK]

Steve,

the default template shows that the div#main styling covers the entire right-block:

Code: Select all

      <!-- Start Content Area -->
      <div id="main">
         <div style="float: right;">{print showbutton=true script=true}</div>
         <h2>{title}</h2>
         {ccontent} <br />

         <!-- Start relational links -->
	 <div class="hr"></div>
	 <div class="right49">
	 	<p>{anchor anchor='main' text='^ Boven'}</p>
	 </div>
         <div class="left49">
            <p>{cms_selflink dir="previous" label="Vorige pagina: "} <br />
            {cms_selflink dir="next" label="Volgende pagina: "}</p>
         </div>
         <!-- The label parameter doesn't need to be there if you're using English, but is here to show how it's used if you don't want the English text "Previous page" -->
	 <!-- End relational links -->

      <hr class="accessibility" />
      </div>

What you can do is wrap a new DIV just around the {content}-tag to define a different styling.

Ronny

EDIT; {my content shows as ccontent as I'm using the cache-module}

[RonnyK]

Steve,

in CSS, adding:

Code: Select all

.content-text
{
	background: #000080;
}

and changing {content} in your template to:

Code: Select all

<div class="content-text">{content} <br /></div>

colors the background of the text-area differently.

Ronny

[biliousfrog]

that's better.

thanks, I can work with that