ozblue Posted March 12, 2007 Posted March 12, 2007 G'day I have just install STS 4.4 and wish to add a background image to a table at the top (100% x120 - "0' margins) the image is 1 x 125 pix and will repeat across the screen to form a gradient "bar" but i can;t get it to work. I have searched the forums and the best i can work out is that the Style sheet might have something to do with it but no real solution to my problem, here is some of the code <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html $htmlparams> <head> <!--$headcontent--> <link rel="stylesheet" type="text/css" href="stylesheet.css"> </head> <body marginwidth="0" marginheight="0" topmargin="0" bottommargin="0" leftmargin="0" rightmargin="0"> [color="#FF0000"]<table border="0" width="100%" cellspacing="0" cellpadding="10" background="images/Head_back.jpg" height="120">[/color] <tr class="header"> <td valign="middle" width="45%" height="99"> <img border="0" src="images/oscommerce.gif"></td> <td align=right width="55%" height="99"> <a href="$urlmyaccount"> <img border="0" src="images/header_account.gif"></a> <a href="$urlcartcontents"> <img border="0" src="images/header_cart.gif"></a> <a href="$urlcheckout"> <img border="0" src="images/header_checkout.gif"></a> </td> </tr> </table> I have tried absolute and relative paths, images are upload (the capital "H" in the image name is bad coding i know). Outside the OSC enviroment the "background="images/Head_back.jpg" height="125" works on a normal HTML page but not in OSC image uploaded to catalog/images and catalog/includes/sts_templates/full/images can anyone help, am i doing this the right way or is there a better way. Thanks Paul.
cjmchch Posted March 12, 2007 Posted March 12, 2007 G'day I have just install STS 4.4 and wish to add a background image to a table at the top (100% x120 - "0' margins) the image is 1 x 125 pix and will repeat across the screen to form a gradient "bar" but i can;t get it to work. I have searched the forums and the best i can work out is that the Style sheet might have something to do with it but no real solution to my problem, here is some of the code <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html $htmlparams> <head> <!--$headcontent--> <link rel="stylesheet" type="text/css" href="stylesheet.css"> </head> <body marginwidth="0" marginheight="0" topmargin="0" bottommargin="0" leftmargin="0" rightmargin="0"> [color="#FF0000"]<table border="0" width="100%" cellspacing="0" cellpadding="10" background="images/Head_back.jpg" height="120">[/color] <tr class="header"> <td valign="middle" width="45%" height="99"> <img border="0" src="images/oscommerce.gif"></td> <td align=right width="55%" height="99"> <a href="$urlmyaccount"> <img border="0" src="images/header_account.gif"></a> <a href="$urlcartcontents"> <img border="0" src="images/header_cart.gif"></a> <a href="$urlcheckout"> <img border="0" src="images/header_checkout.gif"></a> </td> </tr> </table> I have tried absolute and relative paths, images are upload (the capital "H" in the image name is bad coding i know). Outside the OSC enviroment the "background="images/Head_back.jpg" height="125" works on a normal HTML page but not in OSC image uploaded to catalog/images and catalog/includes/sts_templates/full/images can anyone help, am i doing this the right way or is there a better way. Thanks Paul. Use your stylesheet to do it: add this to a seperate class for the individual table or if it is for the main body then add it to the BODY class .classname } background-image: url("images/Head_back.jpg ") { BODY { background-image: url("images/Head_back.jpg ") }
ozblue Posted March 13, 2007 Author Posted March 13, 2007 Hmm where did my other reply go ! anyway....................Take Two Chris thx 4 info but i still cant get it to work, must be the way i am trying to put it together. i googled CSS tutorials and still can't work it out here is what i have done .css file A:hover { color: #AABBDD; text-decoration: underline; } FORM { display: inline; } [color="#FF00FF"]TABLE.start } background-image: url("images/testback1.jpg ") {[/color] TR.header { background: #ffffff; } and my Index file <body marginwidth="0" marginheight="0" topmargin="0" bottommargin="0" leftmargin="0" rightmargin="0"> [color="#FF0000"]<table class="start"[/color] border="0" width="100%" cellspacing="0" cellpadding="10" height="120" > <tr class="header"> <td valign="middle" width="45%" height="99"> <img border="0" src="images/oscommerce.gif"></td> any help appreciated Thx Paul
cjmchch Posted March 14, 2007 Posted March 14, 2007 Hmm where did my other reply go !anyway....................Take Two Chris thx 4 info but i still cant get it to work, must be the way i am trying to put it together. i googled CSS tutorials and still can't work it out here is what i have done .css file A:hover { color: #AABBDD; text-decoration: underline; } FORM { display: inline; } [color="#FF00FF"]TABLE.start } background-image: url("images/testback1.jpg ") {[/color] TR.header { background: #ffffff; } and my Index file <body marginwidth="0" marginheight="0" topmargin="0" bottommargin="0" leftmargin="0" rightmargin="0"> [color="#FF0000"]<table class="start"[/color] border="0" width="100%" cellspacing="0" cellpadding="10" height="120" > <tr class="header"> <td valign="middle" width="45%" height="99"> <img border="0" src="images/oscommerce.gif"></td> any help appreciated Thx Paul this statement here: TABLE.start } background-image: url("images/testback1.jpg ") { change it to TABLE.start { background-image: url("images/testback1.jpg ") } You had your opening and closing brackets around the wrong way. Slight error we all make. Try that and see if it works for you
ozblue Posted March 17, 2007 Author Posted March 17, 2007 Hi Chris A big thankyou...i got it to work Thx Paul
Recommended Posts
Archived
This topic is now archived and is closed to further replies.