CSS: Color Changes

[omega_shadow]

After changing just about every color value assotiated with links in /includes/templates/-mytemplate-/css/stylesheet.css and seeing absulotely no change in my store, I am quite confused.

I was under the impression the Stylesheet controlled all the colors / font sizes and so on and so forth in zencart. So far, it has shown to control nothing, but then again I might be looking at the wrong stylesheet.

All I want to do is change two things: The "hover" color of the links in the "Catagories" side box and Headers over "New Products". Both of these are set to a very dark color and after I changed the template buttions and backgrounds to the disired colors for our store, they started to blend in.

As mentioned above, I have not had much luck with finding these settings in the stylesheet. If someone could be patient enough to give me an example of the block(s) in the Stylesheet that are controling these values so that I could find them and change them I would be greatful.


EDIT: I just noticed a post on this forum about a firefox extention that shows CSS information. Checking that out now....

[gjh42]

The Web Developer extension is worth its weight in gold... well, assume the electrons are heavy ;)

Most of us who answer questions here find it indispensible.

[omega_shadow]

I am seeing that. I am going to have to remember to install this little extension when I boot into windows so I got it on both my OS's

with the amensitiy of the information it gives me, I am still at a loss. It might be my infamiliarity with CSS (Never liked it, used plain HTML on my sites till now) But I still cant find what I am looking for

I found one of the blocks I was looking for (.centerBoxHeading) but there is no text color in that block. . The FFE says the other one is called .category-top and I can not find that anywhere in the stylesheet.

Is there something I am missing?

[gjh42]

Many tags that the PHP code provides are not included in the stylesheet by default; they exist so that anyone who needs to style an element differently from stock can do it without first going into the code to create tags.

Likewise, many things like link and text colors are set for the whole site or large areas of it, and not specifically set for smaller parts as they inherit the general styles.

So if you want .centerBoxHeading text to be different, just add
color: #aabbcc;
or whatever to its declaration in the stylesheet.

If you don't find a.category-top in the stylesheet, just add it and give it whatever styling you want. (You must be starting from /template_default/ or from a downloaded template, as /classic/ has a comprehensive list of styling for a.category-top and its cousins.)

[dbltoe]

You might find the firebug extension to firefox to be a valuable addition to your arnesal. Not only will it show you the css code, it will also show you where the colors or links are inherited from in the first place.

Inherited code can often be the clue for getting something changed. Load and run firebug, then click on inspect.

[omega_shadow]

thanx dbltoe. Going to get that now. Good timeing as I am in Windoze and was just about to get the other extension for this version of FF

Thanx for the info gjh42. That gets me closer to knowing what to do, which usualy ends with me restoring a saved version of the file I was working on up-teen million times as I royaly screw up the code. Yes, this is going to be a very long long day.

I am thinking a.category-top might be the wrong element. The links inside the Category SideBox are what I am after. What would that element be called?

[omega_shadow]

that 7 minute limit for editing posts is freaking moronic

That last line should read: I am thinking a.category-top might be the wrong element. The hover link color inside the Category SideBox is what I am after. What would that element be called?

Also, this might be the wrong place to ask, but "Zen Cart!" is still displayed in tabs and "Zen Cart!, The Art of E-commerce" is still displayed in the title bar of browsers. How do I chamge this?

[omega_shadow]

Well, that other extention proved very useful

Before I edit any files I have a practice of making a copy of the original in the same location with the suffix "_org". I did that in this case with the CSS file. Well, low and behold, zencart was reading both files, the new and the old. It's fixed now and my chamges are now showing up on my site. Might not be a long day after all.

Thanx for the help

[gjh42]

a.category-top:hover {} will address the links when hovered.

The title part is covered in the FAQs: My browser bar says "Zen Cart!, The Art of ...", where do I change that?