Border around center categories box

[kittycat]

Hi all you helpfull people!
I´m in the final stages...
All I´m missing is a border, if possible with a header, around
my center categories box.
I attached a image on how I want it to look like.
This is my shop how it looks now:
http://pinuppeepshop.com/

Any ideas?
Thank YOU !

[gjh42]

Try this (adjust colors & dimensions to your taste):

.centerColumn {
    border: 1px solid #001122;
    } 

.centerColumn h1 {
    font-family: whatever;
    color: #ff99f0; 
    background-color: #334455; 
    border-bottom: 1px solid #001122; 
    padding-bottom: 0.3em; 
    margin: -8px -8px 5px -8px;
    } 

[kittycat]

Try this (adjust colors & dimensions to your taste):

.centerColumn {
    border: 1px solid #001122;
    } 

.centerColumn h1 {
    font-family: whatever;
    color: #ff99f0; 
    background-color: #334455; 
    border-bottom: 1px solid #001122; 
    padding-bottom: 0.3em; 
    margin: -8px -8px 5px -8px;
    } 

Alright, sounds good! Sorry to ask,but...where do I put it?
Thank you very much for helping me!!

[gjh42]

Sorry, I thought you knew since you had already done some customizing.
It could go anywhere in your stylesheet (/includes/templates/your_template/css/stylesheet.css), but best to group it with similar declarations, and if you already have a .centerColumn declaration, combine them rather than having declarations for the same thing scattered around.

[kittycat]

Sorry, I thought you knew since you had already done some customizing.
It could go anywhere in your stylesheet (/includes/templates/your_template/css/stylesheet.css), but best to group it with similar declarations, and if you already have a .centerColumn declaration, combine them rather than having declarations for the same thing scattered around.

Hmm, well I thought it was the stylesheet but when i put the code in there nothing happened, so I thought it must be another place..
Now I tried again and put the code in all possible places in my stylesheet but still nothing changes on my page.
Any idea what I´m going wrong?
The only centerColum declaration I can find in my stylesheet is:
.centerColumn, #bannerOne, #bannerTwo, #bannerThree, #bannerFour, #bannerFive, #bannerSix {
padding: 0.8em;
}

[gjh42]

Are you sure it's the right stylesheet (in the right folder)? Are you sure it is uploading correctly to your server?

[kittycat]

Are you sure it's the right stylesheet (in the right folder)? Are you sure it is uploading correctly to your server?

Pretty sure-
It´s :
puplic_html/includes/templates/MY_TEMPLATE/css/stylesheet.css

Right!?

I´ve copy/paste your code in where it makes most sense..
and then just about everywhere else.
I know I MUST be doing something wrong cause you guys are usually always right...

[gjh42]

Is the code still in your stylesheet? It does not exist in the stylesheet that is being applied to your site (pinuppeepshop.com/includes/templates/purple/css/stylesheet.css).
(pinuppeepshop.com = public_html)

[kittycat]

No I didn´t leave it in my stylesheet. After it didn´t seam to have any effect I took the code out again.
But now its back in the stylesheet - directly underneath:

/*The main content classes*/
#contentColumnMain, #navColumnOne, #navColumnTwo, .centerBoxContents, .specialsListBoxContents, .categoryListBoxContents, .additionalImages, .centerBoxContentsSpecials, .centerBoxContentsAlsoPurch, .centerBoxContentsFeatured, .centerBoxContentsNew, .alert {
vertical-align: top;
}

Thank you!!

[gjh42]

I have to admit I'm stumped. The code is there in your stylesheet, and I can't find anything after it that should override it, except
.centerColumn, #bannerOne, #bannerTwo, #bannerThree, #bannerFour, #bannerFive, #bannerSix {
padding: 0.8em;
}
which does not conflict and is already accounted for in my code.

When I look at the page, I see no border/header, but as soon as I hit Edit CSS, the border and header appear just as they should. There is a bug in Web Developer Edit CSS that causes background images to disappear while editing, so I would think that some background that normally appears on top of this border vanishes, allowing it to be visible; however, I can't find any such thing in the stylesheet.

Just for laughs, what happens if you move the code to the very end of your stylesheet?