background help

sergeh

2006-09-25 02:52

is it possible to have a single background image take the whole page? I have a single jpg that I need to have as a background but right now can't get it to work because everything is split up...

I also need the image to stay where it is even if a user scrolls.. any help would be greatly appreciated

pcoins

2006-09-25 03:10

Hi
for V1.3 QC
in default.css

/* GLOBAL STYLES */
body, h1, h2, h3, h4, h5, h6, p, form, fieldset, img{margin:0;padding:0;border:0px none; }
/* below you can change background and font for all site */
body{padding:15px 0;font-family:Verdana, Helvetica, sans-serif;font-size:10px;text-align:center;background:red;color:#000;}
img{margin-bottom:-2px;}

rename background:red;color:#000;
to

background-image:url(' add your images URL here')

you can see here a test http://p-gr.info/cart/index.php

sergeh

2006-09-25 03:16

how can I do that and have everything in the middle included as well? In your example the middle stays white

jantar

2006-09-25 03:20

Oczywiście że to możliwe.
Właśnie tak mam zrobione na http://www.jantar2005.pl/QCfat1.4
Żeby to uzyskać musisz w pliku default.css i right.css w fragmencie:


/* GLOBAL STYLES */
body,h1,h2,h3,h4,h5,h6,p,form,fieldset,img{margin:0;padding:0;border:0}
/* below you can change background and font for all site */
body{padding:15px 0;font-family:Verdana, Helvetica, sans-serif;font-size:10px;text-align:center;background-color: #FFFFFF;color:#000;}
img{margin-bottom:-2px;}


/* CONTAINER - width and background color of your site */
#container_shadow {
width:760px;background: #b2b2b2;border: 1px #cccccc;
position: relative;
top: 2px;
left: 3px;
margin-left: auto;
margin-right: auto;
border-bottom: 1px #cccccc solid; 
border-right: 1px #cccccc solid;}
#container{width:760px;position: relative;
top: -2px;
left: -3px;
margin: 0em 0em 0em 0em;text-align:left;padding:0;background-color:#FFFFFF;
border-bottom: 1px #929292 solid;
border-right: 1px #929292 solid;}

zamiast


background-color: #ffffff

wstawić np.:


background:url(img/splot.gif)

a obrazki umieszczasz w katalogu templater/img

pcoins

2006-09-25 03:23

/* CONTAINER - width and background color of your site */
#container{width:740px;margin:0 auto;text-align:left;padding:0;background:#fff;}
#container_print{width:16cm;margin:0 auto;padding:20px;text-align:left;padding-top:0;background:#fff;}

rename background:

jantar

2006-09-25 03:49

No widzisz???

...jak chcesz to potrafisz :)
Wystarczyło Ci tylko nieco podpowiedzieć :)

A tak przy okazji kolejna podpowiedź...
Uczcie się chlopaki języka polskiego, bo to może być Wasza przyszlość :D

Pozdrawiam

sergeh

2006-09-25 04:35

thanks it worked :)

pcoins

2006-09-25 04:40

sergeh

can i see your site ??

sergeh

2006-09-25 04:58

not yet :P when it's done I'll post a link

just got another question though, I was able to change the background for the image popups but for some reason there's always a huge white space of at least 200 px in height under the previous and next arrows, any way I can remove that?

here's what I have in my css

#header2{background-image: url(img/gallery_bk.jpg);background-repeat: repeat-x;}
#oPhotoDiv{text-align:center;margin:0px 0 0 0;}
#butt div{background-image: url(img/gallery_bk.jpg);background-repeat: repeat-x;width:100%;height:100%;float:center;padding:3px 0;text-align:center;}
#butt a{color:#f00;font-weight:bold;text-decoration:none;padding:0 10px;}

and here's what I have in gallery.tpl

<div id="header2"><img src="$config[dir_files]img/$config[logo_img]" alt="" />

<div id="oPhotoDiv"><img id="oPhoto" src="/" alt="" title="" /></div>
<div id="butt">
<div> <a href="javascript:void(0);" id="oLL">« « « «</a> </div>
<div> <a href="javascript:void(0);" id="oLR">» » » »</a> </div>
</div>
</div>

I really dont understand why there's an extra 200 pixels there for nothing.

pcoins

2006-09-25 10:08

sergeh Your V is 1.3 ???

sergeh

2006-09-27 21:16

no I think it's 1.2 why?

Back to top