Pagina 1 di 2 1 2 ultimoultimo
Visualizzazione dei risultati da 1 a 10 su 11
  1. #1
    Utente di HTML.it
    Registrato dal
    Jun 2002
    Messaggi
    795

    float non allunga il div contenitore?

    Ciao a tutti.
    Ho questo dubbio sui float: è possibile che un div con proprietà float non "allunghi" automaticamente il div contenitore? perchè il div in questione, molto alto, "sborda" dal contenitore di un bel pò...
    <sfogo> ma porco giuda, leggerlo l'help online ogni tanto! </sfogo>

  2. #2
    Utente di HTML.it L'avatar di floyd46
    Registrato dal
    Feb 2002
    residenza
    Apulia
    Messaggi
    2,641

    Re: float non allunga il div contenitore?

    il float "spinge" un #div a destra (float:right) oppure a sx(flota:left). Sul fatto che faccia allungare verso il basso, che io sappia, non c'entra nulla. Se hai la pagina in rete possiamo vedere l'effetto di cui parli. Se un div, interno a "contenitore", sborda, vuol dire che hai dato una altezza al primo (cioè contenitore) ?
    prova a non settare nessuna altezza per i 2 div.
    spero di essere stato chiaro, altrimenti posta ancora.
    ciao
    "Le persone che realizzano layout con tabelle annidate, spacer gif o che ignorano l'accessibilità non possono più definirsi professionisti." Andy Clarke
    --------------------------------

    www.extrowebsite.com

  3. #3

    soluzione

    aggiungi al contenitore #div la classe .clearfix
    fammi sapere
    Gia



    .clearfix:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
    }

    .clearfix {display: inline-table;}

    /* Hides from IE-mac \*/
    * html .clearfix {height: 1%;}
    .clearfix {display: block;}
    /* End hide from IE-mac */

  4. #4
    Utente di HTML.it
    Registrato dal
    Jun 2002
    Messaggi
    795
    ciao. allora, io i div contenitori li ho dimensionati con height:auto e min-height:100% ... allego immagine, e aggiungo che capita solo con firefox.
    Se serve metto il css e l'html.
    Immagini allegate Immagini allegate
    <sfogo> ma porco giuda, leggerlo l'help online ogni tanto! </sfogo>

  5. #5
    Utente di HTML.it L'avatar di pacovox
    Registrato dal
    Oct 2001
    Messaggi
    557
    E' normale, l'elemento a cui è applicato il float non viene più visto dall'elemento parente(contenitore).
    Prova ad aggiungere subito dopo l'elemento flottante <div style="clear:both"></div>

  6. #6
    caro pacovox,
    non vedo perché aggiungere un altro div se si puó fare tranquillamente con la classe .clearfix che ho ppostato sopra...
    saluti
    Gia

  7. #7
    Utente di HTML.it L'avatar di pacovox
    Registrato dal
    Oct 2001
    Messaggi
    557
    Io non vedo perchè usare molte più righe di codice del normale per un hack che oltretutto aggiunge del contenuto per poi nasconderlo.
    Normalmente in un layout classico con il footer il clear:both si da a quest'ultimo, nel caso di GunraY il footer non c'è ed è per quello che aggiungendo un div vuoto che non crea nessun fastidio si risolve il problema.

  8. #8
    Utente di HTML.it
    Registrato dal
    Jun 2002
    Messaggi
    795
    grazie a entrambi. la classe clearfix ha risolto, il <div style="clear:both"> purtroppo no...
    cosa fa la classe clearfix? e eprchè il clear non ha funzionato? Grazie!
    <sfogo> ma porco giuda, leggerlo l'help online ogni tanto! </sfogo>

  9. #9
    Utente di HTML.it L'avatar di zoom
    Registrato dal
    Dec 2001
    Messaggi
    1,737
    clear annulla gli effetti del float.
    quoto sul non usare codice finora poco supportato e che necessita di un hack quando basta un semplicissimo

    <br style="clear:both;" />

    per ristabilire la corretta visualizzazione...
    Chicco Ravaglia per sempre con noi!

  10. #10
    Utente di HTML.it
    Registrato dal
    Jun 2002
    Messaggi
    795
    il trucchetto del <br... era perfetto! grazie
    per "annulla gli effetti del float" cosa intendi? è come se il contenitore "vedesse" l'altezza del float?
    <sfogo> ma porco giuda, leggerlo l'help online ogni tanto! </sfogo>

Permessi di invio

  • Non puoi inserire discussioni
  • Non puoi inserire repliche
  • Non puoi inserire allegati
  • Non puoi modificare i tuoi messaggi
  •  
Powered by vBulletin® Version 4.2.1
Copyright © 2025 vBulletin Solutions, Inc. All rights reserved.