How do I change the appearance of one sidebox only?

TinaS:

Here you go Kirsten :

Change the color on .leftboxheading (in your stylesheet) to change the blue box header.

The background in the header is weird because I don't find it in the css any place. It confuses me because I have never used the classic template as a basis for templates I write, I have always used template_default.

As far as centering the logo - again I am not finding a #logo style in your stylesheet to position it with - nor is that class called in that header file for that template.

I guess because I don't use the Classic Template and never have I am beginning to be of little help. On template_default I know where and what classes control things just off the top of my head :)

Hope that helps you a little more:)

I See in my CSS were the "#Logo" is. But how do I change it. I know were that is. I just did not know what it meant.

Wow this stinks man. I have looked all over this site for help and I can not seam to get this answer.. What should I do??

See I Changed the Left Box Heading.. Infact it was changed to the Brown Color....

}*/

h3.leftBoxHeading a:hover {
color: #996633;
text-decoration: none;

(the One In RED )

But.. for one its still in blue when you open it. I changed it in Old and the New Stylesheet.

But I Want the code to acually be 00366 Dark Blue

But it does not matter because the color is STILL light blue.

I Also NEED to find out about the Logo on top.

Can anyone else help me here ?
Thanks so much

Well, I went ahead and pasted that code into my
tpl_box_default_left.php
file to start, and two of every sidebox on the left-hand side appeared.

I'm close, but I don't know exactly what to do next.

:wacko:

ok I got the idea how to change the background of the BLUE in the boxes.

Its in my Original_Stylsheet
As

background/image/tile_.jpg ( The image is called "Tile" ) its in there as a background.. NOT a color.

You have to ether changed that Background.. OR Make it a color by doing this

background-color #(YOUR-COLOR);

I hope this helps you.. well at least this is what I have been doing. BUT now I Started over.. because my background I thought I messed it up..
But it ONLY goes half way down.. not sure why...

SEE http://www.kandiesforyou.com/shop

Have any suggestions???

OH I also learned to take away the Logo by the "HEADER" its; Also noted as a Background image.

Xerus Thomas:

Well, I went ahead and pasted that code into my
tpl_box_default_left.php
file to start, and two of every sidebox on the left-hand side appeared.

I'm close, but I don't know exactly what to do next.

:wacko:

Did you ADD my code or did you replace the existing code with mine - You should only have to add the line calling the bottom in order for it to work - I think you got 2 of everything cuz you added mine and left the original in as well:wink2:

Hi Tina -

Phew, I'm so relieved to see your reply. :D

At first, I added the entire code (which gave me two of everything.)
Then, I realized simply to add the line calling the bottom.
I didn't have two of everything anymore (duh me), however, when changing #categoriesBottom in my stylesheet, nothing happens.

I need to figure out which part of this code is calling #categoriesBottom and how.

How does adding to the php code allow us to add new divs/classes to the stylesheet?

Thank you so much for your help & patience with my newb-ness. :wacko:

Sincerely,
Jenny

Jenny I am here - I will help ya in just a sec hun - I have to fix a broken header that I goofed real quick:thumbsup:

Hun in my original post I stated what steps to take. First you wanna add to the bottom of your style sheet the bottom - in my example I did multiple because on that particular template I did diff color side boxes on the template but the basic principle applies.

If you wanna use just one that is fine as well.

So, you add the footer background to your css - and then you add the code to include the footer to the php and poof - zen magic :thumbsup:

Does that help?

If not maybe you can email me a copy of your css and your sidebox files and I can fix it for ya - it's a 5 minute thing :D

I am sooooo confused.

How do I send it to you.. Unfortanlty.. I am not sure how to back anything up yet. So I don't have them in files.. is there anyway you can suggest i Do this.

I Tried the Easy FTP thing.. but that was NOT that easy. LOL

kirsten:

I am sooooo confused.

Hun that one was for Jenny who was asking for help with the bottim of sideboxes - I believe we have you fixed now :)

You two are gonna confuse me soon :lol:

Oh No.. Tina - Ok Sorry about that.

I want to Make my background - All through the page.

See.. were it has it half way down..... ?
http://www.kandiesforyou.com

Is there another place I should be changing ?

Kirsten to fix your background issue look at the top of your css where you have it defined, try taking out the line that says repeat-x I believe that will fix it for you :)

Ok - Maybe some one can tell me to STOP playing around ! LOL

Can you tell me how to fix the top Mainwrapper around.. See the my background is in there. were it should be white. I thought I turned it all back to normal.. but maybe I missed something.. here is my code

/**

• Main CSS Stylesheet
• @package templateSystem
• @copyright Copyright 2003-2005 Zen Cart Development Team
• @copyright Portions Copyright 2003 osCommerce
• @license http://www.zen-cart.com/license/2_0.txt GNU Public License V2.0
• @version $Id: stylesheet_new.css 3286 2006-03-28 01:14:04Z drbyte $
  */

body {
margin: 0;
font-family: verdana, arial, helvetica, sans-serif;
/font-size: 62.5%;/
color: #000000;
}

a img {border: none; }

a:link, #navEZPagesTOC ul li a {
color: #996633;
text-decoration: none;
}

a:visited {
/color: #996633;/
text-decoration: none;
}

a:hover, #navEZPagesTOC ul li a:hover, #navMain ul li a:hover, #navSupp ul li a:hover, #navCatTabs ul li a:hover {
color: #996633;
}

a:active {
color: #996633;
}

h1 {
font-size: 1.5em;
}
h2 {
font-size: 1.4em;
}
h3 {
font-size: 1.3em;
}

h4, h5, h6, LABEL, h4.optionName, LEGEND, ADDRESS, .sideBoxContent, .larger{
font-size: 1.1em;
}

.biggerText {
font-size: 1.2em;
}

h1, h2, h3, h4, h5, h6 {
margin: 0.3em;
}

CODE {
font-family: arial, verdana, helvetica, sans-serif;
font-size: 1em;
}
FORM, SELECT, INPUT {
display: inline;
font-size: 1em;
margin: 0.1em;
}

TEXTAREA {
margin: auto;
display: block;
width: 95%;
}
input:focus, select:focus, textarea:focus {
background: #996633;
}
FIELDSET {
padding: 0.5em;
margin: 0.5em 0em;
border: 3px solid #996633;
}
LEGEND {
font-weight: bold;
padding: 0.3em;
}

LABEL, h4.optionName {
line-height: 1.25em;
padding: 0.1em;
}

LABEL.checkboxLabel, LABEL.radioButtonLabel {
font-size: 0.95em;
margin: 0.2em 0.5em;
}

#logo, .centerBoxContents, .specialsListBoxContents, .categoryListBoxContents, .centerBoxContentsAlsoPurch, .attribImg {
float: left;
}

LABEL.inputLabel {
font-size: 0.95em;
width: 10em;
float: left;
}

LABEL.inputLabelPayment {
width: 15em;
float: left;
}

LABEL.selectLabel, LABEL.switchedLabel, LABEL.uploadsLabel {
width: 12em;
float: left;
}

P, ADDRESS {
padding: 0.5em;
}
ADDRESS {
font-style: normal;
}
.clearBoth {
clear: both;
}
HR {
height: 1px;
margin-top: 0.5em;
border: none;
border-bottom: 2px solid #996633;
}
/warnings, errors, messages/
.messageStackWarning, .messageStackError, .messageStackSuccess, .messageStackCaution {
line-height: 1.8em;
padding: 0.2em;
border: 2px solid #000000;
}
.messageStackWarning, .messageStackError {
background-color: #996633;
color: #ffffff;
}
.messageStackSuccess {
background-color: #996633;
color: #000000;
}
.messageStackCaution {
background-color: #996633;
color: #000000;
}
/wrappers - page or section containers/
#mainWrapper {
background-color: #ffffff
text-align: left;
width: 750px;
vertical-align: top;
}

#headerWrapper, #contentMainWrapper, #logoWrapper, #cartBoxListWrapper, #ezPageBoxList, #cartBoxListWrapper ul, #ezPageBoxList ul, #mainWrapper, #popupAdditionalImage, #popupImage {
margin: 0em;
padding: 0em;
}

#navColumnOneWrapper, #navColumnTwoWrapper, #mainWrapper {
margin: auto;
}
#tagline {
color:#000000;
font-size: 1em;
text-align : center;
vertical-align: middle;
}

#sendSpendWrapper {
border: 0px solid #003366;
float: right;
margin: 0em 0em 1em 1em;
}

.floatingBox, #accountLinksWrapper, #sendSpendWrapper, #checkoutShipto, #checkoutBillto, #csNotifications, #navEZPagesTOCWrapper {
margin: 10px 0px;
width: 46%;
}

.wrapperAttribsOptions {
margin: 0.3em 0em;
}

/navigation/

.navSplitPagesResult {
margin: 0.5em;
font-size: 0.9em;
}
.navSplitPagesLinks {
margin: 0.5em;
font-size: 0.9em;
}
.navNextPrevCounter {
margin: 0em;
font-size: 0.9em;
}
.navNextPrevList {
display: inline;
white-space: nowrap;
margin: 0;
padding: 0.5em 0em;
list-style-type: none;
}

#navMainWrapper, #navSuppWrapper, #navCatTabsWrapper {
margin: 0em;
background-color: #ffffff;
font-weight: bold;
color: #000000;
height: 1%;
width: 100%;
}

#navMain ul, #navSupp ul, #navCatTabs ul {
margin: 0;
padding: 0.5em 0em;
list-style-type: none;
text-align: center;
line-height: 1.5em;
}
#navMain ul li, #navSupp ul li, #navCatTabs ul li {
display: inline;
white-space: nowrap;
}
#navMain ul li a, #navSupp ul li a, #navCatTabs ul li a {
text-decoration: none;
padding: 0em 0.5em;
margin: 0;
color: #000000;
}

#navEZPagesTOCWrapper {
font-weight: bold;
float: right;
height: 1%;
border: 0px solid #000000;
}
#navEZPagesTOC ul {
margin: 0;
padding: 0.5em 0em;
list-style-type: none;
line-height: 1.5em;
}
#navEZPagesTOC ul li {
white-space: nowrap;
}
#navEZPagesTOC ul li a {
padding: 0em 0.5em;
margin: 0;
}

#navMainSearch, #navCategoryIcon, .buttonRow, #indexProductListCatDescription {
margin: 0.5em;
}
#navBreadCrumb {}
#navEZPagesTop {
background-color#003366;
background-repeat: repeat-x;
border: 2px solid #996633
}
#navBreadCrumb, #navEZPagesTop {
font-size: 0.95em;
font-weight: bold;
margin: 0em;
padding: 0em;
}

#navColumnOne {
padding: 0.5em;
border-left: 2px solid #996633;
}
#navColumnTwo {
padding: 0.5em;
border-right: 2px solid #996633;
}

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

#productDescription, .shippingEstimatorWrapper {
padding: 0.5em;
}

.alert {
color: #FF0000;
margin-left: 0.1em;
font-size: 0.9em;
}
.advisory {}
.important {
font-size: 1.1em;
}
.notice {}
.rating{}
.gvBal {
float: right;
}
.centerColumn, #bannerOne, #bannerTwo, #bannerThree, #bannerFour, #bannerFive, #bannerSix {
padding: 0.8em;
}

.smallText, #siteinfoLegal, #siteinfoCredits, #siteinfoStatus, #siteinfoIP {
font-size: 0.9em;
}

/Shopping Cart Display/
#cartAdd {
float: right;
text-align: center;
margin: 1em;
border: 2px solid #996633;
padding: 1em;
}

.cartTableHeading TH {
border-bottom: 2px solid #996633;
}

.cartTableHeading, #cartSubTotal {
background-color: #996633;
height: 2.2em;
}

#cartSubTotal {
border-top: 2px solid #996633;
font-weight: bold;
text-align: right;
line-height: 2.2em;
padding-right: 2.5em;
}

.cartProductDisplay, .cartUnitDisplay, .cartTotalDisplay, .cartRemoveItemDisplay, .cartQuantityUpdate, .cartQuantity, #cartInstructionsDisplay, .cartTotalsDisplay {
padding: 0.5em 0em;
}
.cartUnitDisplay, .cartTotalDisplay {
text-align: right;
padding-right: 0.2em;
}
#scUpdateQuantity {
width: 2em;
}

.cartQuantity {
width: 4.7em;
}

.cartNewItem {
color: #996633;
position: relative; /do not remove-fixes stupid IEbug/
}

.cartOldItem {
color: #996633;
position: relative; /do not remove-fixes stupid IEbug/
}

.cartBoxTotal {
text-align: right;
font-weight: bold;
}

.cartRemoveItemDisplay {
width: 3.5em;
}

#cartAttribsList {
margin-left: 1em;
}

.normalprice, .productSpecialPriceSale {
text-decoration: line-through;
}
.productSpecialPrice, .productSalePrice, .productSpecialPriceSale, .productPriceDiscount {
color: #996633;
}

#cartBoxListWrapper ul, #ezPageBoxList ul {
list-style-type: none;
}

#cartBoxListWrapper li, #ezPageBoxList li, .cartBoxTotal {
margin: 0;
padding: 0.2em 0em;
}

.totalBox {
width: 5.5em;
text-align: right;
padding: 0.2em;
}

.lineTitle, .amount {
text-align: right;
padding: 0.2em;
}

.amount {
width: 5.5em;
}

/Image Display/
#productMainImage, #reviewsInfoDefaultProductImage, #productReviewsDefaultProductImage, #reviewWriteMainImage {
margin: 0em 1em 1em 0em ;
}
.categoryIcon {}
#cartImage {
margin: 0.5em 1em;
}

/Attributes/
.attribImg {
width: 20%;
margin: 0.3em 0em;
}

.attributesComments {}

.centerBoxContents, .specialsListBoxContents, .categoryListBoxContents, .additionalImages, .centerBoxContentsSpecials, .centerBoxContentsAlsoPurch, .centerBoxContentsFeatured, .centerBoxContentsNew {
margin: 1em 0em;
}

h2.centerBoxHeading, .productListing-rowheading {
margin: 0em;
background-color: #003366;
font-size: 1em;
color: #ffffff;
border-bottom: 2px solid #996633; padding-left:0.2em; padding-right:0.2em; padding-top:0.5em; padding-bottom:0.5em
}
.centerBoxWrapper, .tabTable {
padding: 0px;
height: 1%; /do not remove- IEhack/
border: 2px solid #996633;
margin-bottom: 1em;
}

.sideBoxContent {
/background-color: #ffffff;
padding: 0.4em;/
}

/h3.rightBoxHeading, h3.rightBoxHeading a {
font-size: 1.1em;
color: #996633;
}/

/.rightBoxHeading {
margin: 0em;
background-color: #003366;
padding: 0.2em 0em;
}/

h3.leftBoxHeading a:hover {
color: #996633;
text-decoration: none;
}
h3.rightBoxHeading a:hover {
color: #996633;
text-decoration: none;
}
.rightBoxContent {
background-color: #ffffff;
margin-bottom: 1em;
}

.centeredContent, th, #cartEmptyText, #cartBoxGVButton, #navNextPrevWrapperTop, #navNextPrevWrapperBottom, #navCatTabsWrapper, #navEZPageNextPrev, #bannerOne, #bannerTwo, #bannerThree, #bannerFour, #bannerFive, #bannerSix, #siteinfoLegal, #siteinfoCredits, #siteinfoStatus, #siteinfoIP, .center, .cartRemoveItemDisplay, .cartQuantityUpdate, .cartQuantity, .cartTotalsDisplay, #cartBoxGVBalance, .leftBoxHeading, .centerBoxHeading, .rightBoxHeading, .productListing-data, .accountQuantityDisplay, .ratingRow, label#textAreaReviews, #productMainImage, #reviewsInfoDefaultProductImage, #productReviewsDefaultProductImage, #reviewWriteMainImage, .centerBoxContents, .specialsListBoxContents, .categoryListBoxContents, .additionalImages, .centerBoxContentsSpecials, .centerBoxContentsAlsoPurch, .centerBoxContentsFeatured, .centerBoxContentsNew, .gvBal, .attribImg {
text-align: center;
}

#bestsellers .wrapper {
margin: 0em 0em 0em 1.5em;
}

#bestsellers ol {
padding: 0;
margin-left: 1.1em;
}

#bestsellers li {
padding: 0;
margin: 0.3em 0em 0.3em 0em;
}

#bannerboxHeading {
background-color: #996633;
}
#upProductsHeading {
text-align: left;
}
#upDateHeading {
text-align: right;
}
/misc/
.back {
float: left;
}
.forward {
float: right;
}

.bold {
font-weight: bold;
}

.rowOdd {
background-color: #ffffff;
height: 1.5em;
vertical-align: top;
}

.rowEven {
background-color: #ffffff;
height: 1.5em;
vertical-align: top;
}

CAPTION {
/display: none;/
}

#myAccountGen li, #myAccountNotify li {
margin: 0;
}

.accountTotalDisplay, .accountTaxDisplay {
width: 20%;
text-align: right;
/vertical-align: top/
}

.accountQuantityDisplay {
width: 10%;
vertical-align: top
}

TR.tableHeading {
background-color: #ffffff;
height: 2em;
}

#siteMapList {
width: 90%;
float: right;
}

.ratingRow {
margin: 1em 0em 1.5em 0em;
}

LABEL#textAreaReviews {
font-weight: normal;
margin: 1em 0em;
}

#popupShippingEstimator, #popupSearchHelp, #popupAdditionalImage, #popupImage, #popupCVVHelp, #popupCouponHelp, #popupAtrribsQuantityPricesHelp {
background-color: #ffffff;
}

k got that.. But now my WHOLE page... I mean the middle.. should be White. LOL
And the top were the Links are... should be white too. Were do I change that back to wrhite. I think I took a code out some were. Now as soon as I figure that part out I will finished. :)

Kirsten this time I am confused :) Which part are you wanting white ? Where the categories are in the top ?

Yes and the whole middle. Were is use to be white.

What I Wanted the background to be.. Was AROUND the middle "White" Table.

Do I make Sense?

Gotcha :)

Add this to the very bottom of your stylesheet :

#contentMainWrapper
{background-color: #FFFFFF;}

That should do it Kirsten :thumbsup:

Got it you are AWESOME girl..

Quick Question.. nothing to write mom about. LOL He always wanted to say that ... lol

Do you think that there should be WHITE at the top in the middle were my .. Umm forgot the name you know the links ( Top ones )
Or I cant and it has to be that background?

It just looks like its hard to read. :unsure:

Kirsten this on is eezy peezy LOL

#navMainWrapper, #navSuppWrapper, #navCatTabsWrapper {
margin: 0em;
background-color: #ffffff;
font-weight: bold;
color: #000000;
height: 1%;
width: 100%;
}

That is lacking a "f"

put in the "f" and it will fix it with a white background ;)

TinaS:

Hun in my original post I stated what steps to take. First you wanna add to the bottom of your style sheet the bottom - in my example I did multiple because on that particular template I did diff color side boxes on the template but the basic principle applies.

If you wanna use just one that is fine as well.

So, you add the footer background to your css - and then you add the code to include the footer to the php and poof - zen magic :thumbsup:

Does that help?

If not maybe you can email me a copy of your css and your sidebox files and I can fix it for ya - it's a 5 minute thing :D

Hi Tina -
Am I supposed to be changing
<div id="crsnavwrap">
to another name in my php?
What should that div id be pointing to?

Thanks again for all your help. I'm sure someday this good karma will come back to you. : )

-Jenny