Calcolare la lunghezza totale di una pagina web

[deleted_193]

Salve, ho un elemento css che si deve estendere per tutta la pagina.
Nel css ho messo auto a widht, ma si blocca dopo il primo elemento. Adesso se creo una tabella che si estende per tutta la pagina(sapendo la lunghezza totale della pagina) non ci sono problemi, mentre al contrario se la lunghezza delle pagine è variabile(dipende dai contenuti) la tabella ovviamente non si adatta automaticamente.
In sostanza non riesco a determinare la lunghezza della pagina in automatico.
Avete qualche idea in merito?

[deleted_193]

Grazie per la risposta. Ho sostituito così:
Vecchio:

height:3000px;

Nuovo:

min-height:100%;

anche con height su 100% o auto non funziona nulla.
Ora ti posto il codice:

#content {
	background-image:url('background2.jpg');
	background-repeat:repeat;
	font-family:"Arial";
	font-size:18px;
        margin:0;
        padding:0;
	position:relative;
  	text-align:center;
	width:1024px;
	height:100%;/*2420px; --> valore originale vecchie pagine*/
/*	min-height:100%; --> provato su tuo consiglio, ma non funzionante */
}

<div id="content">
	<table>
			<div id="elementi">
				<div id="elemento1">
					<?php include("../file1.php"); ?>
				</div>
				<div id="elemento2">
					<?php include("../file2.php") ?>
				</div>
			</div>
			<div id ="immagine"></div>
			<div id="elemento3">
				<?php include "../file3.php"; ?>
			</div>

Per quanto riguarda l'ultimo elemento, ovvero la tabella dove si ferma ho messo in include un semplice "table tr td Ciao! /td /tr/ /table", ma non funziona lo stesso, il background si interrompe. Gli altri div contengono due sole cose, padding e float:

padding: 10px, 0, 0, 0;
float: left;

Ovviamente i valori cambiano da elemento in elemento, altrimenti si accavallerebbero.
Non sò propio come risolvere. Ciao!

[deleted_193]

Ho ripassato gli elementi ad uno ad uno, ricereando il css con il metodo che mi hai mostrato(perfettamente funzionante sulla pagina di prova solo con body e content), ma ho questo problema:

@charset "utf-8";

body{
	background-image:url('background.jpg');
	background-repeat:repeat;
	margin: 15px;/* distanza della pagina interna da quella esterna */
	padding: 0px; /* simile */
	height: 100%;
}

#content{
	background-image:url('background2.jpg');
	background-repeat:repeat;
	min-height:100%;
	border-radius:10px;
	font-family:"Arial";
	font-size:18px;
	margin:0px auto 0;
	position:relative;
	text-align:center;
	width:1024px;
}

#immagine{
	background-image:url('../immagini/immagine.jpg');
	background-repeat:no-repeat;
	width:1024px;/*l'originale è di 1064 px*/
	height:142px;
	position: absolute;
	top: 40px;
	left: 0px;
}

#padding{
	padding: 10px 30px 10px 30px;/*top, right, down, left*/
}
/* registrati e cerca sono richiamati dentro #padding*/
#registrati{
float: left;
}

#cerca{
float:right;
}

#menu{
	position: absolute;
	top:182px;
	left:0;
	width:100%;
}

#prova_pos{/*posiziona una semplice scritta all'interno della pagina, l'ho creato per vedere se funzionava tutto bene*/
	position: absolute;
	top:210px;
	height: 20px;
}

#ric_cont{
	position: absolute;/* --> specificarlo causa un problema con lo sfondo bianco della pagina*/
	top:230px;/*230px;*/
	left:0;
}

Come specificato ho un interruzione dello sfondo bianco(a dire il vero stranamente se tolgo ric_count lo sfondo si allunga per tutti gli elementi, se lo inserisco si estende solo per metà primo elemento richiamato).Se cambio in #ric_count la posizione da absolute in relative lo sfondo si allunga come desiderato, ma si sposta di cicra 100px dal bordo della pagina.
Ricapitolando con absolute ottengo un'interruzione, con un "accorciamento" dello sfondo, mentre con relative ottengo un allungamento corretto dello sfondo, ma con le posizioni sballate.
Quello che non capisco è anche questo: #ric_count e #prova_pos sono uguali, ma prova pos non causa problemi di nessuna natura.
Tuttavia dentro #ric_count avviene una chiamata ajax, però non dovrebbe essere solo quello il problema, perchè con relative allunga la pagina e con absolute no.

[deleted_193]

Dopo aver fatto delle prove, ho capito quali elementi non funzionavano in modo corretto, e adesso ho un errore che non si può definire propio tale, ma una probabile mancanza:
Lo sfondo adesso si estende per tutta la pagina, ma non propio in maniera corretta. Una volta caricata la pagina se la si riduce e poi la si riallarga lo sfondo bianco diminuisce e aumenta a seconda dei casi. Quindi lo sfondo si adatta all'ingrandimento del browser, peccato che se ci si allontana ci ritroviamo una pagina grandisssima, e se ci avviciniamo e poi scorriamo la barra verso il basso ci accorgiamo che lo sfondo bianco si è notevolmente accorciato.
Dimenticavo, se si cambiano tutte le posizioni da absolute in relative lo sfondo bianco rimane bloccato su una lunghezza pari al 100% della pagina(con ingrandimento a 100%, quindi 1 a 1) e non si modifica di ocntinuo come absolute.
Ecco il codice modificato in alcuni punti e con qualche aggiunta(non tutte commentate):

@charset "utf-8";

body{
	background-image:url('background.jpg');
	background-repeat:repeat;
	margin: 15px;/* distanza della pagina interna da quella esterna */
	padding: 0px; /* simile */
	height: 100%;
}

#content{
	background-image:url('background2.jpg');
	background-repeat:repeat;
	min-height:100%;
	border-radius:10px;
	font-family:"Arial";
	font-size:18px;
	margin:0px auto 0;
	position:absolute;/*se metto qui relative lo sfondo si blocca dopo il primo elemento*/
	text-align:center;
	width:1024px;
}

#immagine{
	background-image:url('../immagini/immagine.jpg');
	background-repeat:no-repeat;
	width:1024px;/*l'originale è di 1064 px*/
	height:142px;
	position: absolute;
	top: 40px;
	left: 0px;
}

#padding{
	padding: 10px 30px 10px 30px;/*top, right, down, left*/
}
/* registrati e cerca sono richiamati dentro #padding*/
#registrati{
float: left;
}

#cerca{
float:right;
}

#menu{
	position: absolute;
	top:182px;
	left:0;
	width:100%;
}

#prova_pos{/*posiziona una semplice scritta all'interno della pagina, l'ho creato per vedere se funzionava tutto bene*/
	position: absolute;
	top:210px;
	height: 20px;
}

#ric_cont{
	position: absolute;/* --> specificarlo causa un problema con lo sfondo bianco della pagina*/
	top:230px;/*230px;*/
	left:0;
        height:100%;
}

[deleted_193]

Ho appena fatto un'altra prova:

#content{
	background-image:url('background2.jpg');
	background-repeat:repeat;
	border-radius:10px;
	font-family:"Arial";
	font-size:18px;
	margin:0px auto 0;
	position:relative;
	text-align:center;
	width:1024px;
	height: auto !important;
	min-height:100%;/*3000px;*/
	overflow: hidden;/* provato anche scroll*/
}

Con 3000px tutto ok, ma quando metto 100% anche lui mi carica solo la parte che vede lo schermo, con la differenza che questa volta gli elementi che eccedono il div al posto di essere stampati fuori vengono completamente tagliati dal contenitore.
Da notare infine che con scroll ottengo l'effetto voluto, solo ch emi considera la pagina come una specie di finestra iframe, con una sua barra di scorrimento separata, e visto che non va bene e che non capisco per il momento come fare sai alla luce di quanto emerso come ovviare al problema?

[deleted_193]

Risolto, ho dovuto cambiare moltissimi elementi, inoltre a un certo punto ho capito che mi faceva 100% dello schermo e non della pagina.

[deleted_193]

Si, ho notato molti errori, anche di sintassi, come ad esempio"html, body{}", al posto del semplice "body{}" cambia completamente il risultato, ecc.
Comunque mi sono annotato tutti gli errori e comportamenti animali nel css, visto che sicuramente riserviranno in futuro.