Problema background-image e risoluzione 1240x1024

[ANTAGONIA]

Buon giorno, ho questo problemino, la risoluzione del sito è ottimizzata 1024x768 ed è tutto ok.
Ovviamente, se cambio in 1240x1024 c'è uno sfarfallio del background-image...
Vorrei sapere, come si fà, ad includere il background e non avere problemi di visualizzazione, nel senso..
La struttura del sito, resta perfettamente al centro ma l'immagine del background, resta al suo posto..

questo è il css e la pagina:

/*nel css*/
html, body {margin: 0;padding: 0; background-image:url(../img/sf.gif);}
body{font-family : arial,sans-serif;font-size : 12px;text-align : center;}
div#container{
	position : relative;
	width : 760px;
	margin : 0 auto;
	border-left : 0 solid #000; 
	border-right : 0 solid #000; 
	color : #000;
	text-align : left;
}

/*nella pagina*/
<div id="container">
	<div id="index">
	            [img]img/loghi/logoCMF2.jpg[/img]
	 </div>
</div>

Come posso fare per centrare il background?
Grazie mille....

[ricman]

Originariamente inviato da ANTAGONIA

html, body {margin: 0;padding: 0; background-image:url(../img/sf.gif);}
...

Come posso fare per centrare il background?

Il backgound si centra così:

background-position: 50% 50%;

per maggiori info puoi cercare su gooogle o qui proprio "background-position"

[ANTAGONIA]

ti ringrazio, molto gentile.
Però una domanda, devo avere ovviamente uno sfondo a 1024x768 ed uno 1240x1024, altrimenti a destra e a sinistra si ripete...
Devo utilizzare altro?
Grazie

[ANTAGONIA]

al momento ho risolto cosi, però mi dici se è corretto?

/*nello script js, intercetto la risoluzione*/
//RISOLUZIONE DELLO SCHERMO
	swidth=screen.width;
	sheight=screen.height;
	savheight=screen.availHeight;
	savwidth=screen.availWidth;
	sdepth=screen.colorDepth;
	t_pixel= swidth + " x " + sheight;

/*nella default.php eseguo il controllo e scelgo l'immagine di background appropriata*/
<link type="text/css" rel="stylesheet" href="css/FF.css">










<script src="script/script.js" type="text/javascript"></script>
<script>
	if(t_pixel=="1024 x 768"){
		document.write("<style>body{font-family : arial,sans-serif;font-size : 12px;text-align : center;background-image:url(img/sf.gif);}</style>");
		document.write(t_pixel);
		
	}
	else {
		document.write("<style>body{font-family : arial,sans-serif;font-size : 12px;text-align : center;background-image:url(img/sf1240x1024.gif);}</style>");
		document.write(t_pixel);
		
	}
</script>

che ne pensi?
Grazie ancora

[ricman]

Originariamente inviato da ANTAGONIA
al momento ho risolto cosi, però mi dici se è corretto?
... ...

che ne pensi?

Non uso mai queste tecniche, quindi ti posso solo consigliare di testarlo bene.

Sei sicuro di aver bisogno di tutta quella roba? Non potevi risolvere senza js?
Tipo aggiungere nel css dopo background-position anche un
background-repeat: no-repeat; /*oppure repeat-y a seconda delle nescessità*/

[ANTAGONIA]

ho provato, con i vari parametri che ha il background, tipo, no-repeat, repeat-x o y..
Ma, dato che, l'immagine in questione è una gif, con queste dimensioni, width 1280px ed height 1px, con il no-repeat non lo visualizzava ecco perchè ho dovuto scegliere questo escamotage..

dimmi per favore se hai altre idee, altrimenti ti ringrazio tanto..!!
Alla prox

[ricman]

Originariamente inviato da ANTAGONIA
ho provato, con i vari parametri che ha il background, tipo, no-repeat, repeat-x o y..
Ma, dato che, l'immagine in questione è una gif, con queste dimensioni, width 1280px ed height 1px, con il no-repeat non lo visualizzava ecco perchè ho dovuto scegliere questo escamotage..

Scusa ma il repeat-y si usa proprio nei casi come i tuoi, cioè un immagine larga quanto vuoi ed alta 1px che si ripete in verticale. DEVE funzionare