Elastic background in una cella e script macchina da scrivere

[benja]

buondì a tutti!
Vorrei sapere com'è possibile realizzare:
1) Un elastic background, ovvero uno sfondo che si adatta automaticamente alle dimensioni della finestra, ed in particolare ad una cella di una tabella composta di 1 riga e 2 colonne (nella colonna di sinistra)
2) Inserire uno script che scrive il testo a mò di macchina da scrivere

Nello specifico: il primo punto non ho idea da che punto partire ma dei colleghi mi han detto che con il CSS è possibile farlo; il secondo punto è in pratica fattibile in quanto esiste già sul sito di html, ma nn so se sia possibile inserire come script qualora il primo punto nn sia disponibile come CSS ma bensì come javascript!

Grazie in anticipo x le risposte!

Ben

[gra-fichetto]

Originariamente inviato da benja

Vorrei sapere com'è possibile realizzare:
1) Un elastic background, ovvero uno sfondo che si adatta automaticamente alle dimensioni della finestra, ed in particolare ad una cella di una tabella composta di 1 riga e 2 colonne (nella colonna di sinistra)

Non so se sia l'unico modo...

Copia e incolla nella cella che preferisci (naturalmente sostituisci il tuo testo ed inserisci il nome esatto della tua immagine:

<div id="contenitore">


Testo testo testo testo</p>
[img]immagine.gif[/img]
</div>

ed aggiungi al tuo CSS:

#contenitore{
	border: 1px solid red;
	margin: 0;
	padding: 0;
	width: 100%;
	height: 100%;
	position: absolute
}
#contenitore p{
	position: absolute;
	z-index: 2
}

#contenitore img{
	width: 100%;
	height: 100%
}

[benja]

Originariamente inviato da gra-fichetto
Non so se sia l'unico modo...

Copia e incolla nella cella che preferisci (naturalmente sostituisci il tuo testo ed inserisci il nome esatto della tua immagine:

<div id="contenitore">


Testo testo testo testo</p>
[img]immagine.gif[/img]
</div>

ed aggiungi al tuo CSS:

#contenitore{
	border: 1px solid red;
	margin: 0;
	padding: 0;
	width: 100%;
	height: 100%;
	position: absolute  
}
#contenitore p{
	position: absolute
	z-index: 2
}

#contenitore img{
	width: 100%;
	height: 100%
}

ok! Togliendo i due position: absolute il CSS diventa compatibile anche con firefox (altrimenti l'immagine diventa grande quanto tutta la larghezza dello schermo, impedendo di leggere il TD destro); ho notato poi che se ridimensiono la finestra fino a che l'img è più piccola dell'img stessa questa nn si rimpiccolisce ma mantiene la dimensione originaria!

Keep working on it!

Thanks!

[gra-fichetto]

Togliendo i due position: absolute...

Il primo puoi eliminarlo.
Il secondo, cioè quello nella regola

#contenitore p{
position: absolute
z-index: 2
}

ti conviene lasciarlo nel caso in cui tu voglia inserire, oltre lo sfondo, anche del testo.
Opportunamente potresti settare la larghezza delle tue celle in percentuale.