problems apply Killer boxes to Legend skin

[jerseyjoe]

Please see the sad status of www.tiffanytravelonline.com/store

What I'm trying to do is use the portion of the Killer skin that controls boxes in Legend so I can cause the boxes to look like suitcases.

Up to the point you can see, I'm OK, but I'm stuck at this point, with the result you see. The layout.css is below

1) The boxes are snugged left even though I have set padding that is not being applied.

2) the graphic boxFootBg.gif is not displaying even though it is on the server in the same folder with boxTitleBg.gif which is displaying. I've fiddled with top and bottom padding and top/botttom margins - even to the point of excess, but it doesn't show. Yet, it is there:

http://www.tiffanytravelonline.com/store/s...s/boxFootBg.gif

3) I can't set vertical padding of 5px between the boxes. Nothing I've tried is working so it suggests I'm not trying the right thing in the right place.

4) then of course, there's the biggie - the way the page breaks at the center column. I tried changing box widths, column widths, moving the shopping cart and sale items to the left side, even though I want a three column page - and so on, but I can't move it.

Obviously I've got a lot to learn about layout.css. Here's the relevant section of it at the moment.

QUOTE

}

.boxTitleLeft, .boxTitleRight {

font-family: Verdana, Arial, Helvetica, sans-serif;

font-size: 70%;

background-image: url(../styleImages/backgrounds/boxTitleBg.gif);

width: 160px;

height: 10px;

padding-top: 10px;

padding-left: 10px;

background-repeat: no-repeat;

font-weight: bold;

}

.boxFootLeft, .boxFootRight {

background-image: url(../styleImages/backgrounds/boxFootBg.gif);

width: 160px;

height: 40px;

padding-left: 10px;

background-repeat: no-repeat;

margin-bottom: 10px;

}

.boxContentLeft, .boxContentRight {

border-left: 4px solid #A8A7A7;

border-right: 4px solid #A8A7A7;

background-color: #FFFFea;

padding-left: 5px;

padding-top: 9px;

padding-bottom: 10px;

width: 147px;

}

.boxContent {

border-top: 3px solid #CFE3F5;

border-right: 1px solid #ffffea;

border-bottom: 1px solid #ffffea;

border-left: 1px solid #ffffea;

padding: 3px;

font-family: Verdana, Arial, Helvetica, sans-serif;

font-size: 75%;

color: #333333;

margin-bottom: 40px;

}

.colMid {

position: relative;

width: 398px;

float: left;

}

.colRight {

position: relative;

width: 160px;

padding-left: 5px;

right: 9px;

float: right;

}

.boxContent {

border-top: 1px solid #A8B4B0;

border-right: 1px solid #5E85CF;

border-bottom: 1px solid #5E85CF;

border-left: 1px solid #5E85CF;

padding: 3px;

font-family: Verdana, Arial, Helvetica, sans-serif;

font-size: 75%;

color: #333333;

background-color: #FFFFFF;

margin-bottom: 5px;

}

END QUOTE

[Guest garysmith]

Hi Jerseyjoe

If you would like to pm me I can give you an email address to send me the skin you are working on and I will have a look at it for you.

Gary

[Guest garysmith]

All done if you want to check it out.

http://www.tiffanytravelonline.com/store/index.php

I have PM'd you with details of the fixes.

Regards

Gary