Problema height 100%

**Sonikag** · 14-07-2008, 10:14

Il mio css è questo...

codice:

html, body{ 
 margin:0; 
 padding:0; 
 text-align:center;
  background-color: #EBEBEB;
    font-family:Tahoma, Verdana, "Times New Roman";
	font-size:100%;
	height:100%
}
 
#contenitore{ 
 width:829px; 
 text-align:left;  
margin-left:auto; 
 margin-right:auto;
   	background-image: url(img/graf/sfondo.jpg);
	background-repeat: no-repeat;
	background-position: right bottom;
	padding:95px 0px 165px 0px;
}

L'html è

codice:

<body>
<div id="contenitore">..
</div>
</body>

Vorrei che l'immagine di sfondo fosse allineata alla base della pagina ma se metto un height al 100% su contenitore poi la pagina diventa diversi px in più del dovuto.

**Mich_** · 14-07-2008, 10:25

Il problema sta nel padding che hai nel #contenitore.
Se metti height:100% non puoi mettere anche il padding, pena l'effetto da te segnalato.

Domanda:
a che ti serve il padding? Se ti serve per separare gli elementi interni, forse puo` essere sostituito dal corrispondente margin agli elementi interni; e in tal caso poi puoi usare il 100% per l'altezza del contenitore.

In alternativa:
metti gli sfondi nel body, eventualmente posizionando lo sfondo in modo diverso.

**Sonikag** · 14-07-2008, 10:43

Grazie...
Allora tolto il padding e tutto è andato... Ho messo un margin top sull'header che è dentro a contenitore ma il problema mi è risorto!

**Mich_** · 14-07-2008, 10:59

E` difficile (e` un'eufemismo) dare consigli su qualcosa che non si conosce.

Evidentemente il problema si e` spostato su un blocco interno, ma non hai messo il codice di tale blocco. In alternativa posta il link.

Di solito non si mettono limiti all'altezza, pensando che in caso di finestra piccola il sito possa scrollare in verticale; ma in qualche caso particolare, in cui l'elemento grafico e` preponderante rispetto all'elemento contenutistico, si possono usare soluzion differenti pensate specificatamente per quel layout.

**Sonikag** · 14-07-2008, 11:06

Header è questo sotto e si trova dentro #contenitore:

codice:

#header{
 position:relative; 
 width:100%;
 font-size:0.8em;
 min-height: 54px;
height: auto !important;
height: 54px;
margin:0px;
padding:0px;
}

Discussione: Problema height 100%

Strumenti discussione

Ricerca discussione

Visualizza

Problema height 100%

Permessi di invio