Layout su tre righe e footer sempre in basso

**xcs** · 13-12-2004, 21:31

Originariamente inviato da Jerry Masslo
il problema di testa è risolvibile inserendola senza height dentro il corpo centrale menre per il footer solo se non si vuole che stia necessariamente attaccato al fondo altrimenti bisogna ricorrere a position:absolute con conseguenti problemi che lì risolvono usando misure dei caratteri in pixel!!! altamente sconsigliato e infatti, se aggiungi testo al footer ridimensionando copre altro testo in mozilla e opera, cosa che non succede in ie perché con quella misura i caratteri non vengono ridimensionati, imho, pessima soluzione, almeno in un paio che ho visto era così.

Dimenticavo...complimenti per il sito. Gran bel lavoro!

**Jerry Masslo** · 14-12-2004, 00:52

Originariamente inviato da xcs
Infatti...hai dato un'occhiata a http://www.alistapart.com/articles/footers

ho trovato la soluzione perfetta (esempio 3)

ho letto ora i complimenti ma la risposta era già pronta:

credo che abbiamo concetti differenti di perfezione

ti spiego come la vedo io

una delle prime cose da evitare è usare caratteri in pixel, per il fatto semplice e fatale che ie non ridimensiona i caratteri in pixel, detto questo se vedo un font-size: e pixel sottolineo di rosso quel font-size, ci faccio altre linee, lo cerchio di rosso e se è un foglio finisce nel cestino.

quella soluzione sfrutta un difetto che va evitato accuratamente e con i browser che non hanno quel difetto non funziona!!!

purtroppo sopporto poche cose male come il font-size in pixel se poi addirittura oltre che usato lo vedo proposto come soluzione inizio a perdere il controllo quindi ti prego se hai link da proporre assicurati che non ci siano font-size in pixel

poi tu consideri problematiche le soluzioni in percentuali quando è l'esatto opposto, cioè chiediti quando hai pixel se puoi avere lo stesso in percentuale e se stai usando pixel chiediti che intervallo di utilizzo di monitor e risoluzioni ti concedono

un pixel è una misura sensata forse solo per foto, in quanto danno un'indicazione sulla grandezza ottimale di visualizzazione in riferimento alla qualità della foto perché sono bitmap dipendendenti da quei pixel, oltre le foto un pixel è una misura in balia del numero degli altri pixel che può avere uno schermo, delle sue caratteristiche costruttive, e i tuoi pixel di adesso potrebbero diventare mediamente minuscoli nel giro di un breve tempo e non essere già ora adatti a molti schermi che non consideri e associarci poi l'impossibilità di regolarli ti fa capire perché disturbano tanto

detto questo ti ho cercato una soluzione con qualche percentuale in meno che seppure parecchio zozza e con un'immagine inesistente e anche un div pezza e imperfetta tuttavia per il solo fatto di non usare font-size in pixel rispetta requisiti minimi di decenza che mancano in quei link.

<html>
<head>
<title>Piede basso</title>
<style type="text/css">
* {margin:0;padding:0}
html, body {height:100%}
body {
background:gray;
overflow:auto;
text-align:center
}
.testa {
background:maroon;
color:white;
text-align:left;
padding-bottom:.4em;
padding-top:.2em
}

.corpo {min-height:90%;
height:auto!important;
height:90%;
width:80%;
margin:auto;
background:silver;
text-align:left
}

.piede {
height:10%;
color:white;
width:80%;
margin:auto;
background:silver;
position:relative;
text-align:left
}

.piede img {width:0;
height:100%;
vertical-align:bottom;
}
.piede span {
vertical-align:bottom;
background:green;
background:teal;
position:relative;
z-index:10;
bottom:.4em
}
.pezza {position:absolute;
bottom:0;
left:0;
width:100%;
background:teal;
height:2em;
z-index:0
}
</style>
</head>
<body>
<div class="corpo">
<div class="testa">testa</div>
corpo
</div>
<div class="piede">
[img]Pezza.png[/img]
<span>piede</span>
<div class="pezza"></div>
</div>
</body>
</html>

**xcs** · 14-12-2004, 15:31

Jerry non posso che darti ragione soprattutto dopo l'ultima soluzione che hai inserito. Si creano piccoli difetti giocando un po con la dimensione della finestra (doppio scroll) ma è normale che ci siano quando si lavora in %.
Sicuramente il problema è la mia impostazione mentale. Anche se tutti i documenti che creo sono xhtml 1.0 e css compatibili devo cominciare a guardare un po oltre e dedicarmi all'accessibilità assoluta (o quasi).
La cosa che mi preoccupa di più però sono le strutture complesse come le tabelle (visivamente!

)...

Thanks!

**Jerry Masslo** · 14-12-2004, 17:44

anche io avevo visto quel doppio scroll ma solo torturando la finestra del browser, non è normale perché solo quello può scrollare quindi chi ne mette due va un po' in bambola.

comunque togliendo l'overflow:auto da body compare lo spazio dello scroll in ie ma si toglie a tutti la possibilità di metterne due.

scusa per ieri ma ognuno ha dei punti deboli e quando vedo un font-size in pixel perdo il controllo, se poi sono soluzioni proposte da siti importanti diventa dura, e dire che in un primo momento mi ero controllato ma poi tu hai pure insistito

**xcs** · 14-12-2004, 17:59

Originariamente inviato da Jerry Masslo
anche io avevo visto quel doppio scroll ma solo torturando la finestra del browser, non è normale perché solo quello può scrollare quindi chi ne mette due va un po' in bambola.

comunque togliendo l'overflow:auto da body compare lo spazio dello scroll in ie ma si toglie a tutti la possibilità di metterne due.

scusa per ieri ma ognuno ha dei punti deboli e quando vedo un font-size in pixel perdo il controllo, se poi sono soluzioni proposte da siti importanti diventa dura, e dire che in un primo momento mi ero controllato ma poi tu hai pure insistito

Non ti preoccupare, so perfettamente cosa vuol dire essere contraddetti quando si è assolutamente convinti, a torto o a ragione, delle proprie idee. Per fortuna avevo preso pochi caffè!

Scusa ma mentre ci sei sapresti dirmi perchè con la DTD XHTML 1.0 l'overflow del body non mi funzia?
Ciao

**Jerry Masslo** · 15-12-2004, 10:28

immagino tu ti riferisca a ie, giusto?

è uno di quei comportamenti per cui non tratto ie6 in standard mode, visto che anche in standard fa a modo suo.

io metto un commento html in cima alla pagina che ha lo stesso effetto di mettere la dichiarazione xml, fa funzionare anche ie6 in quirk mode, in questo modo tutti gli ie funzioneranno in quirk e non si dovranno tenere due balie di lingue diverse per quelli, te la cavi con una.

**xcs** · 15-12-2004, 11:21

Originariamente inviato da Jerry Masslo
immagino tu ti riferisca a ie, giusto?

è uno di quei comportamenti per cui non tratto ie6 in standard mode, visto che anche in standard fa a modo suo.

io metto un commento html in cima alla pagina che ha lo stesso effetto di mettere la dichiarazione xml, fa funzionare anche ie6 in quirk mode, in questo modo tutti gli ie funzioneranno in quirk e non si dovranno tenere due balie di lingue diverse per quelli, te la cavi con una.

Immagini bene.
Ho visto la dichiarazione che usi nei tuoi documenti...ma scusa mi spieghi come il w3c ti convalida la pagina come xhtml 1.1 quando la dichiari che il documento è conforme ad HTML 4.0 Transitional?

Discussione: Layout su tre righe e footer sempre in basso

Strumenti discussione

Ricerca discussione

Visualizza

Permessi di invio