- Home
- Categorie
- Coding e Sistemistica
- HTML e CSS
- Problema con i DIV con altezza 100%
-
Problema con i DIV con altezza 100%
Ciao a tutti!
Sto sviluppando una template per TYPO3 ovviamente tutto senza tabelle..
Ho riscontrato parecchi problemi di visualizzazione...e sono riuscito a risolvere quasi tutto..tranne il fatto che mi esce il contenuto da un DIV..che ho impostato con altezza al 100%Stavolta il problema è firefox, di solito mi sballa tutto su IE6, ma controllando il sito sul pc windows con IE6 funziona alla perfezione..mentre questo è quello che vedo su firefox:
-
se ci linki il sito o ci metti anche un file di testo con gli stili e l'html vediamo di aiutarti
-
il sito non mi va di linkarlo(magari posso linkarlo in PVT se vuoi) oppure posso postare il file .css se puo essere utile...:)
-
questo è il css, se vi puo servire:
[HTML]@charset "UTF-8";
body, html {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
color: #999999;
background-color: #666666;
background-image: url(../images/bgBody.png);
background-repeat: repeat-x;
height:100%;
}#container {
margin-top: 25px;
width: 650px;
margin: auto;
height:100%;
}#searchBox {
height:25px;
text-align:right;
}#header {
width: 650px;
height: 100px;
background-color:;
background-image: url(../images/bgLogoTop.png);
background-repeat: repeat-x;
border-bottom: 2px solid #212121;
}#topMenu {
height: 20px;
}#flashBox {
height: 100px;
background-color: #202020;
margin-top: 0px;
margin-bottom: 4px;
}#contentBox {
width: 650px;
background-color: #222222;
height:100%}
#newsBox {
width:500px;
background-color:;
float:left;
height:100%;
}#newsBoxContent {
margin: 4px;
height:100px;
overflow: visible;
}#bannerBox {
width: 150px;
background-color:;
float:left;
height:100%;}
#footer {
float:left;
width:650px;
background-color: #444444;
color: #27BFFE;
text-align:center;
padding-top:2px;
padding-bottom:2px;
font-size:11px;}
a{
font-size:11px;}[/HTML]
-
ragazzi nessuno mi sa aiutare?
-
metti al container "height:auto"; e poi aggiungi una nuova proprietà: p{float:left;}. Il codice a livello di foglio di stile è un pò incasinato. L'elemento float per il posizionamento interno non è mai facile da gestire e vedo che l'hai messo un pò qua e un pò la. Ci sono ancora dei problemi non visibili ad occhio nudo ma scovabili con firebugs , ma se ti funziona e ti va bene così dovrebbe andare. (ah non mi funziona il tasto invio della tastiera si vede? =P )
-
Ah aspetta. Mettendo P come float però ti crea un problema nella disposizione di altri oggetti.Vedo di controllare
-
ho provato mettendo height:auto nel container (sia in quello principale che in quello che contiene i 2 div: quello dei banner e quello delle news) ma è peggio ancora..in quanto quello dei banner resta alto per la sola altezza del banner e il contenuto nel "boxNews" va fuori ugualmente...
il float:left l'ho messo solo nei 2 box centrali, è l'unico modo per disporli come sono adesso no?
-
prova usando clear:both;
-
mettendolo dove?
-
Alla fine del div direi
Posso vedere in pvt il codice html così posso dirti bene?
-
:Dsi certo, ti linko il sito in PM allora
-
Anche secondo me con un clear:both dovresti risolvere il problema
-
Ho provato!! ma niente da fare...non funziona
please help me
-
@alexp said:
Ho provato!! ma niente da fare...non funziona
please help me Gira anche a me via PM il codice che ci do un'occhiata
-
Nessuno ha la risposta?
Io ho due die nidificati:Il div padre è di altezza variabile, e il figlio dovrebbe essere al 100% dell'altezza del padre.
Se metto però al figlio 100%, questo mi prende il 100% dell'altezza della pagina... azz
-
@Dusy said:
Nessuno ha la risposta?
Io ho due die nidificati:Il div padre è di altezza variabile, e il figlio dovrebbe essere al 100% dell'altezza del padre.
Se metto però al figlio 100%, questo mi prende il 100% dell'altezza della pagina... azz
Mi succede solo se specifico una altezza non liquida per l'elemento padre. Se metto l'altezza del padre in % va tutto bene.
Non è che puoi postare il link della pagina in questione? Forse c'è qualche altro elemento che da fastidio.
-
Girami il link alla pagina in privato