Scusate, uso i margini percentuali ma li ho sempre impostati in maniera 'bruta' adattandoli fino a che non trovo quello che mi piace.
Ora vorrei usarli in maniera seria.
Mettiamo di avere questo layout.css
Molto semplicemente un header, una parte centrale composta da un laterale ed un corpo centrale ed un piede.codice:body,html { position: absolute; top:0; left:0; margin: 0; padding: 0; height: 100%; width:100%; background: #000003; font-size: 10pt; cursor:pointer; clear:both; } #container { position: relative; margin:0; padding: 0; top:0; left:0; width:100%; height:100%; border:none; } #logo { position: absolute; margin:2% 0 0 2%; padding: 0; width:25%; height:25%; background: transparent; z-index: 999; border:none; } /* TESTATA */ header { position: relative; margin:0 0 0 25%; padding: 0; top:0; left:0; width:75%; height:15%; background: red; float:right; border:none; } #userbox { position: relative; margin:1% 0 0 4%; padding: 0; top:0; left:0; width:92%; height:90%; background: blue; float:left; border:none; } /* -- ASIDE -- */ aside { position: relative; margin:25% 0 0 0; padding: 0; top:0; left:0; width:25%; height:75%; background: red; float:left; border:none; } /* -- CONTENT -- */ #box { position: relative; margin:0; padding: 0; top:0; left:0; width:75%; height:75%; background: white; float:left; border:none; } footer { position: relative; margin:0; padding: 0; top:0; left:0; width:75%; height:10%; background: green; float:right; border:none; }
Allora, l'header mi lascia uno spazio a sinistra vuoto pari al 25% del totale della larghezza e fin qui ok.
Poi quello che non capisco è già nell'UserBox.
Io lascio 1% di margine superiore, in teoria se do un'altezza di 98% dovrebbe lasciarmi 1% di margine inferiore ed invece con altezza a 90% ho l'effettivo 1% di margine inferiore
Mentre orizzontalmente mi trovo con la matematica 100 -(4 + 92) = 4
La seconda cosa che non capisco è nell'ASide:
Io se lascio il 25% dall'alto (che è vuoto) mi esce dallo schermo e mi crea la barra, se lascio la stessa altezza del di header come margine non è alto uguale. Per essere alto uguale deve essere a 10.8%
I Bordi sono a 0 ed i padding a 0 e non ci sono elementi interni.
Che matematica o logica usano i margini ??
Grazie Daniele

Rispondi quotando