How do I change the appearance of one sidebox only?

[Robert T]

I want to begin customizing the columns and the sideboxes but I don't want a header and footer and the same appearance for all sideboxes. Initially I want to customize the categories sidebox.
What do I edit to change one box in particular and not all sideboxes?

[TinaS]

You can achieve this in the css.

Whichever box you are working with (you say Categories so I'll use it), you will add the defines to your css to tell it to over ride the default when it displays the box. The elements you will want to define are :

#categoriesHeading
#categoriesContent
(and maybe this - I added it on mine) if you are using a custom "bottom"
#categoriesBottom

Basically, what you want is totally achieveable in the Stylesheet.

[Ajeh]

NOTE: on the View Source you will see the class and id ...

This helps in customizing a given sidebox ... example for the Featured Sidebox to touch its class you see:

class="leftBoxContainer" id="featured"

That class leftBoxContainer is used by all sideboxes ... the id featured is only used by the Featured sidebox ...

[Robert T]

Yes but you are talking about defining CSS to apply to something. I need to know where I am applying the CSS. What file?

[Ajeh]

Your stylesheets are in your:
/includes/templates/your_templates_dir/css

You would be editing or adding to that to make changes ...

Usually for an id you are adding as the code is there for you ... but it is not defined separately unless you need to make changes for your personal site ...

[Robert T]

OK yes I know where the stylesheet is and how to edit it, I thought that I had to define in CSS and then apply to another file. I did not realize that defining as you said would make changes based on CSS assignments in the tpl files.

I defined #categoriesContent and this working fine and I changed the border of the left sideboxes to '0' but there is still some padding between the edge of the categories content and the actual sidebox it is in. How do I get rid of that padding?

[TinaS]

Robert - border, padding, and margin all define different things. Changing the border to 0 simply removes the color border - padding:0 will remove any padding (which I believe is what you are referring to) and Margin:0 will move the text/contents all the way to the "padded" edge.

Hope that makes sense.

[Robert T]

Thanks Tina,

I do understand these things. I should really provide links so you can see what I am talkinag about as I try to figure these things out. I determined that what I was seeing could be controlled from within the Layout Settings. I had a 10px difference between the Left Box width and the left column width.

I have defined the #categoriesContent and was able to change the background color and padding. I tried to define the #categoriesHeading but it did not change anything. If I change the .leftboxheading it changes all the headings but for some reason I can't take control of just the Categories heading.

[Ajeh]

Robert ... have you an URL we can peek at vs guessing here what your stylesheets are doing perhaps?

[Robert T]

This is the link to my work-in-progress shop.

http://tmrdesign.com/knotshop

It changes constantly but as of right now it is as I described with the categories heading not changing and still under the control of the textboxheading class.