Joomla Templates Club 406,261 posts

[melanieb Friend melaniebJoin date: July 2011Posts: 274Downloads:0Uploads:23 Thanks: 31 Thanked: 23 times in 1 posts]

#188017

Hi,

I want the background of my site to be white. I have changed this in the template.css. Howver I now need to add a border around the main sheet or content block to separate the background from the main body.

I am not sure what the ‘main body’ block is called as have tried adding a border to body and body.bd but nothing changes so assuming its called something else.

Can anyone point me to the right css name?

[TomC Moderator TomCJoin date: October 2014Posts: 14077Downloads:58Uploads:137 Thanks: 948 Thanked: 3155 times in 2495 posts]

#494889

So that I can try to best assist you, please provide the url of the site you’re working on,
as well as set “Optimize CSS” to “No” within your Template Manager–General settings

[melanieb Friend melaniebJoin date: July 2011Posts: 274Downloads:0Uploads:23 Thanks: 31 Thanked: 23 times in 1 posts]

#494902

Hi Tom,

does this image help:

I have made my background white but it now blends in with the main content area so i just want to add a border

---

Attachments:

1. 

[TomC Moderator TomCJoin date: October 2014Posts: 14077Downloads:58Uploads:137 Thanks: 948 Thanked: 3155 times in 2495 posts]

#494905

It helps . . . . but can you provide the url of the site you’re working on, as well as set “Optimize CSS” to “No” within your Template Manager–General settings ??

:((

[melanieb Friend melaniebJoin date: July 2011Posts: 274Downloads:0Uploads:23 Thanks: 31 Thanked: 23 times in 1 posts]

#494918

Hi tom,

I have sent you the link privately as site is still under construction and also set the optimise css to no

Many thanks

[TomC Moderator TomCJoin date: October 2014Posts: 14077Downloads:58Uploads:137 Thanks: 948 Thanked: 3155 times in 2495 posts]

#494923

You are going to need to modify several different CSS rules with “border” properties to achive the effect you’re going for.
The good news is, all of the rules are within the same CSS file. 😎

START WITH . . . .

Within file path –> /templates/ja_mendozite/css/template.css
at line 970, add additional border properties to this CSS rule – as follows:

#ja-topsl .main {
border-left: 1px solid #E5E5E5
border-right: 1px solid #E5E5E5
padding: 0;
}
}

Likewise . . . .

Within file path –> /templates/ja_mendozite/css/template.css
at line 827, add additional border properties to this CSS rule – as follows:

#ja-container .main {
border-left: 1px solid #E5E5E5
border-right: 1px solid #E5E5E5
padding: 20px 0 0;
}

Likewise . . . .

Within file path –> /templates/ja_mendozite/css/template.css
at line 1109, add additional border properties to this CSS rule – as follows:

#ja-botsl .main {
border-top: 1px solid #E5E5E5
border-left: 1px solid #E5E5E5
border-right: 1px solid #E5E5E5
padding: 0;
}

NOTE:
For the last part, you may want to delete the “border-top” property to give the whole thing a better “flow”
… unless of course you like the border/separation look.

Let me know if this achieves the kind of result you were looking for.

1 user says Thank You to TomC for this useful post

1. melanieb

[melanieb Friend melaniebJoin date: July 2011Posts: 274Downloads:0Uploads:23 Thanks: 31 Thanked: 23 times in 1 posts]

#494997

Hi Tom,

thank you so much – that is exactly what I wanted – perfect.

[TomC Moderator TomCJoin date: October 2014Posts: 14077Downloads:58Uploads:137 Thanks: 948 Thanked: 3155 times in 2495 posts]

#495036

Glad to be of assistance . . . All the best with your continuing site development !!!

🙂

[Author]

Posts