• V
    User Newbie •

    [IE6] Problema div a capo con layout 2 colonne

    Salve, io sono Claudio. Ho realizzato un layout a 2 colonne semifluido con la barra di navigazione laterale di dimensione fissata e il div dei contenuti che occupa la restante parte del wrapper, la cui dimensione è definita in percentuale. Uso una faux column per risolvere il problema del background della barra di navigazione.
    Il problema riguarda solo IE6. Quando inserisco nel div dei contenuti un'immagine e ridimensiono la pagina, accade che non appena la dimensione del div diventa inferiore a quella dell'immagine, il div stesso scorre sotto la barra di navigazione invece di restare allineato al suo posto. E' un problema risolvibile?

    Il css è il seguente:

    #wrapper{
        width:100%;
        background-color:white;
        margin:0;
        padding:0;
        background-image:url("../images/left-sidebar.png");
        background-repeat:repeat-y;
        padding-bottom:20px;
}

#main{
     margin-left:230px;
    font-family:Verdana,Tahoma,sans-serif;
    color:#222222;
    font-size:85%;
    border:1px solid black;
    
}


#left{
        text-align:left;
        width:200px;
        float:left;
        display:inline;
        color:white;
        font-size:0.8em;
        font-family:Verdana,sans-serif;
        padding-top:30px;
        margin-right:0px;
        border:1px solid black;
}

```Esiste una soluzione?
    0
  • C
    Super User •

    Ciao Claudio, benvenuto e complimenti per il nome 😄

    Non so quale sia il comportamento che tu vorresti, ti consiglio di provare a leggere qualcosa sulla proprietà overflow.

    http://www.w3schools.com/Css/pr_pos_overflow.asp

    :ciauz:

    0
  • V
    User Newbie •

    Grazie! In realtà erano cose che già sapevo, ma mi è servito dare comunque un'occhiata.
    Tanto che alla fine sono riuscito a risolvere il rpoblema :wink3:

    0
  • G
    User Newbie •

    Ciao, ho lo stesso problema.
    Come hai risolto?

    G.

    0
  • V
    User Newbie •

    Ciao dipende dall'effetto che vuoi ottenere.
    Se vuoi evitare di tagliare le immagini puoi fissarne la larghezza in percentuale in modo che si adattino al div (insomma renderle fluide) e mantenere per quest'ultimo overflow:visible o auto (nell'ultimo caso apparirà una barra di scorrimento nel caso di elementi di larghezza superiore a quella del div).
    Altrimenti puoi settare overflow:hidden per "tagliare" il contenuto eccedente.
    Niente di troppo ricercato né originale. Cerca solo di prestare attenzione ai div cui applichi le proprietà di overflow, scegliendo l'annidamento più adatto alle tue esigenze.

    Non so se ho centrato la risposta. In caso contrario chiedi pure nuvamente. Ciao! :wink3:

    0
  • G
    User Newbie •

    Grazie!!!
    Ho risolto con overflow:hidden.

    G.

    0
Effettua l'accesso per rispondere