Background image troubles

November 27, 2006

Hi there,

how do i add a background image to the rest of the store. I edited the style sheet under where it says BODY

BODY {

 background: #white;

background-image: url('http://www.keepnthememories.com.au/images/crumple-bg.jpg');


 color: #663300;

 margin: 0px;

but the background image only appears to the sides of the header and i want it to appear down the sides of the whole store...

Here's what it looks like now : http://www.keepnthememories.com.au/catalog/

Kirsten

BigMark · November 27, 2006

Hi Kirsten,

Instead of using background-image: url('http://www.keepnthememories.com.au/images/crumple-bg.jpg');

Use background-image: url ('/images/crumple-bg.jpg');

Regards,

Mark

November 27, 2006

There's still white covering it. how do i remove the white, i just want white running down the centre under the header and the crumple background showing on the sides!..

Here's my style sheet code if that helps :

/*

 $Id: stylesheet.css,v 1.56 2003/06/30 20:04:02 hpdl Exp $



 osCommerce, Open Source E-Commerce Solutions

 http://www.oscommerce.com



 Copyright (c) 2003 osCommerce



 Released under the GNU General Public License

*/



.boxText { font-family: Verdana, Arial, sans-serif; font-size: 10px; }

.errorBox { font-family : Verdana, Arial, sans-serif; font-size : 10px; background: #ffb3b5; font-weight: bold; }

.stockWarning { font-family : Verdana, Arial, sans-serif; font-size : 10px; color: #cc0033; }

.productsNotifications { background: #f2fff7; }

.orderEdit { font-family : Verdana, Arial, sans-serif; font-size : 10px; color: #663300; text-decoration: underline; }



BODY {

background: #white;

background-image: url('/images/crumple-bg.jpg');


 color: #663300;

 margin: 0px;

}



A {

 color: #663300;

 text-decoration: none;

}



A:hover {

 color: #663300;

 text-decoration: underline;

}



FORM {

display: inline;

}



TR.header {

 background : white;



}



TR.headerNavigation {

 background: #b1b18b;

}



TD.headerNavigation {

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

 font-size: 10px;

 background: #b1b18b;

 color: #663300;

 font-weight : bold;

}



A.headerNavigation { 

 color: #663300; 

}



A.headerNavigation:hover {

 color: #663300;

}



TR.headerError {

 background: #54381c;

}



TD.headerError {

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

 font-size: 12px;

 background: #54381c;

 color: #dbdbb8;

 font-weight : bold;

 text-align : center;

}



TR.headerInfo {

 background: #54381c;


}



TD.headerInfo {

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

 font-size: 12px;

 background: #54381c;

 color: #dbdbb8;

 font-weight: bold;

 text-align: center;

}



TR.footer {

 background: #b1b18b;


}



TD.footer {

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

 font-size: 10px;

 background: #b1b18b;

 color: #dbdbb8;

 font-weight: bold;

}



.infoBox {

 background: #dbdbb8;

}



.infoBoxContents {

 background: #dbdbb8;

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

 font-size: 10px;

}



.infoBoxNotice {

 background: #dbdbb8;

}



.infoBoxNoticeContents {

 background: #dbdbb8;

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

 font-size: 10px;

}



TD.infoBoxHeading {

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

 font-size: 10px;

 font-weight: bold;

 background: #b1b18b;

 color: #663300;

}



TD.infoBox, SPAN.infoBox {

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

 font-size: 10px;

}



TR.accountHistory-odd, TR.addressBook-odd, TR.alsoPurchased-odd, TR.payment-odd, TR.productListing-odd, TR.productReviews-odd, TR.upcomingProducts-odd, TR.shippingOptions-odd {

 background: #dbdbb8;

}



TR.accountHistory-even, TR.addressBook-even, TR.alsoPurchased-even, TR.payment-even, TR.productListing-even, TR.productReviews-even, TR.upcomingProducts-even, TR.shippingOptions-even {

 background: #dbdbb8;

}



TABLE.productListing {

 border: 1px;

 border-style: solid;

 border-color: #663300;

 border-spacing: 1px;

}



.productListing-heading {

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

 font-size: 10px;

 background: #b1b18b;

 color: #dbdbb8;

 font-weight: bold;

}



TD.productListing-data {

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

 font-size: 10px;

}



A.pageResults {

 color: #663300;

}



A.pageResults:hover {

 color: #663300;

 background: #854200;

}



TD.pageHeading, DIV.pageHeading {

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

 font-size: 20px;

 font-weight: bold;

 color: #66300;

}



TR.subBar {

 background: #bb9b77;

}



TD.subBar {

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

 font-size: 10px;

 color: #663300;

}



TD.main, P.main {

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

 font-size: 11px;

 line-height: 1.5;

}



TD.smallText, SPAN.smallText, P.smallText {

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

 font-size: 10px;

}



TD.accountCategory {

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

 font-size: 13px;

 color: #663300;

}



TD.fieldKey {

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

 font-size: 12px;

 font-weight: bold;

}



TD.fieldValue {

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

 font-size: 12px;

}



TD.tableHeading {

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

 font-size: 12px;

 font-weight: bold;

}



SPAN.newItemInCart {

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

 font-size: 10px;

 color: #663300;

}



CHECKBOX, INPUT, RADIO, SELECT {

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

 font-size: 11px;

}



TEXTAREA {

 width: 100%;

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

 font-size: 11px;

}



SPAN.greetUser {

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

 font-size: 12px;

 color: #be9f7e;

 font-weight: bold;

}



TABLE.formArea {

 background: #dbdbb8;

 border-color: #663300;

 border-style: solid;

 border-width: 2px;

}



TD.formAreaTitle {

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

 font-size: 12px;

 font-weight: bold;

}



SPAN.markProductOutOfStock {

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

 font-size: 12px;

 color: #663300;

 font-weight: bold;

}



SPAN.productSpecialPrice {

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

 color: #ff0000;

}



SPAN.errorText {

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

 color: #dbdbb8;

}



.moduleRow { }

.moduleRowOver { background-color: #b1b18b; cursor: pointer; cursor: hand; }

.moduleRowSelected { background-color: #dbdbb8; }



.checkoutBarFrom, .checkoutBarTo { font-family: Verdana, Arial, sans-serif; font-size: 10px; color: #663300; }

.checkoutBarCurrent { font-family: Verdana, Arial, sans-serif; font-size: 10px; color: #663300; }



/* message box */



.messageBox { font-family: Verdana, Arial, sans-serif; font-size: 10px; }

.messageStackError, .messageStackWarning { font-family: Verdana, Arial, sans-serif; font-size: 10px; background-color: #dbdbb8; }

.messageStackSuccess { font-family: Verdana, Arial, sans-serif; font-size: 10px; background-color: #dbdbb8; }



/* input requirement */



.inputRequirement { font-family: Verdana, Arial, sans-serif; font-size: 10px; color: #dbdbb8; }

November 28, 2006

ok i figured out half the problem. I needed to add the background info to the includes/header.php file as i used the contribution to centre my store...

but now does anyone know where to edit so that the centre table part is just white??? :blink:

Kirsten

November 28, 2006

ok yes i like replying my own messages but thought it would be helpful incase anyone has the same issues.. i've been learning alot!!

i fixed the problem

includes/header.php -

<div style="text-align: center; background-image: url('/images/crumple-bg.jpg');; margin: 0;">
<div style="text-align: left; background : #ffffff; margin: 0px auto; width: 685px;" >
<table border="0" width="100%" cellspacing="0" cellpadding="0" >
 <tr class="header">
<td valign="middle"> </td>

Background image troubles

Recommended Posts

Guest

BigMark

Guest

Guest

Guest

Archived

Browse

Activity