[Solved]How to add a bg img to a div, different on each page

For discussion and questions related to CMS Specific templates and stylesheets (CSS), and themes. or layout issues. This is not a place for generic "I don't know CSS issues"
Post Reply
jasnick
Power Poster
Power Poster
Posts: 695
Joined: Sat Jan 15, 2011 8:36 am
Location: Western Australia

[Solved]How to add a bg img to a div, different on each page

Post by jasnick »

Just using HTML and CSS, I would give each page an id (body id="index">, body id="contactus">) and so on, so that I could change the CSS if necesary for individual pages.

I have a #sidebar that contains a #picturediv. I need to put a different image on each page as a background to the text in the #picturediv.

How is this sort of thing done in CMSMS?

Thanks.
Last edited by jasnick on Sat Feb 26, 2011 12:50 am, edited 1 time in total.
uniqu3

Re: How to add a bg img to a div, different on each page

Post by uniqu3 »

In your page template do something like:

Code: Select all

</__body class="{page_alias}>
In your stylesheet do then:

Code: Select all

body.home #picturediv {
 some: style;
}

body.contact-us #picturediv {
 some: otherstyle;
}
jasnick
Power Poster
Power Poster
Posts: 695
Joined: Sat Jan 15, 2011 8:36 am
Location: Western Australia

Re: How to add a bg img to a div, different on each page

Post by jasnick »

OK - thank you very much - I will do that!
uniqu3

Re: How to add a bg img to a div, different on each page

Post by uniqu3 »

just got reminded by Ronny on IRC that once again i wrote something stupid :)
So if you do use this dont forget $ before page_alias

Code: Select all

</__body class="{$page_alias}>
jasnick
Power Poster
Power Poster
Posts: 695
Joined: Sat Jan 15, 2011 8:36 am
Location: Western Australia

Re: How to add a bg img to a div, different on each page

Post by jasnick »

LOL - Thanks again! I'll mark this Solved now and post back if I have any difficulties.
Post Reply

Return to “Layout and Design (CSS & HTML)”