Changing css rules of multiple pages

[acummins]

I want to assign different css rules to some pages like product_info, address_book, etc,. I added some css codes to the php files of those pages which start with tpl at the beginning of their names. However, this is a time consuming task and I would like to know if it is possible to create a css file (or multiple files) and link it to the pages that I want to change the css properties of.

Secondly, is it OK to add css rules to the pages in the 'Define Pages editor' without wrapping the code with html code? For instance, would it be just fine to add a code like;

<style type="text/css">
.centerColumn {
background: #fff;
}
</style>

OR do I have put opening and closing html tags at both ends? This question also applies to the first question above.

Any help appreciated..

[kobra]

Instead of styling inline, you should read the readme in your css folder about stylesheets per page etc

[acummins]

Actually I had read the readme before but couldn't get it at first, but now I am OK. However, one question still remains unresolved. I am not sure if I will create external style sheets for tens of different pages as this wouldn't be an efficient way of using css files. But let's assume that I want to create one common style sheet which will host the css rules of, say 5, pages. Something similar to a gatekeeper style sheet but I need only one style sheet. Is such thing possible?

[Lorenzo1915]

You can use @import directive inside a css but stylesheets cannot be used with conditional statements like a programming language, this is out of their scope.

Stylesheets implements inheritance so the better choice is to compile various stylesheets where the latters overwrite objects of formers only where needed, using the zencart way for stylesheets ie per page style.

If you need minor accomodations and you want to use inline css you can do that using the php files loaded in per-pages definitions in /include/modules/pages/various_pages. Here you can put a files called jscript_main.php that is loaded after the template css files.

This file is used to load jscripts in the header of a page but you can also use it at your service to write out your per-pages inline css .

Cya

[acummins]

Lorenzo thank you for your tip but it is too technical for me. I think I'll stick to style sheets on per page basis...

Just before I go, Do you know how I can make the centerColumn as tall as contentMainWrapper? I want CC stretch further down the page so it completely covers the CMW but not the copyright note and Home link.

[jacksonp]

The approach I take to my sites, whether the layout is the same design or different designs, is to have a global style sheet. Most likely, there are styles that you will your on every page, even if the layout is different. For example, all your design center on the page would be a global sytle.

Use a global CSS for styles that you use throughout the site and use individual external style sheets for individual page layouts.

This will break up the CSS, make the site easier to manage in the future, and make your CSS shorter.

[acummins]

That's exactly what I'm doing. I was just concerned that having tens of external style sheets may slow down the download speed but I don't think I'll have to create that many if I use the global sheet effectively and create just a few customised ones. Thank you for your help...