• A
    User Newbie •

    Sovrapposizione immagini background in 2 div diverse

    Buongiorno,
    premetto che sono principiante in css.
    Vorrei sovrappore due immagini che sono ciascuna il background di una div:
    la prima:

    #container {background:#D9FFFF url(images/container.png) top right no-repeat; border:5px solid #0067FE; margin:0 auto 20px; padding:5px 20px 20px; width:730px;}

    la seconda: ```
    #desc {background:#505050 url(images/front3.jpg) bottom left repeat-y; clear:both; color:#fff; /* height:200px; */ margin:5px 0 15px; padding:0 0 5px 0;}

    
l'Html invece è:

[HTML]<div id="container"> 
    .... [/HTML]

e più lontano:

[HTML]<div id="desc">....[/HTML]

in cui desc è contenuta in container, come intuibile.

Ora vorrei che l'immagine di container si sovrapponesse a quella di desc.
Ma non riesco nemmeno a trovare una traccia su come fare....
Grazie in anticipo.
    0
  • A
    User Newbie •

    Buonasera,
    dunque ,
    ho trovato una soluzione, secondo me sporca e scomoda, ma funziona.
    lascio qui il metodo , se mai fosse utile.

    Allora :
    ho creato una seconda div, di nome "container 2",
    e l'ho posizionata all'interiore della div "desc",
    cosi:

    <div id="container"><div id="desc"><div id="container2">...,
    con i seguenti valori:

    #container {background:url(images/container.png) top right no-repeat;
    #desc {background:#505050 url(images/front3.jpg) bottom left repeat-y;
    #container2 {background:url(images/container.png) top right no-repeat;a questo punto visualizzavo l'immagine "container.png" sovrapposta a quella contenuta nella div"desc" e uguale a quella sullo sfondo del "container" ma non nella stessa posizione. Con l'effetto di aver lo stesso disegno si , ma come un'immagine ripetuta, non un tutt'uno.
    Non riuscendo a posizionare l'immagine secondo delle coordinate xy, ho semplicemente creato una seconda immagine ritagliando da container.png la distanza fra l'altezza di "container", l'altezza di "desc" e il margine laterale.

    per visualizzare l'effetto andate qui:
    lupeficara.com/IE/forum/index-esempio.html

    0
  • A
    User Newbie •

    Buongiorno, vorrei aggiungere che questa soluzione funziona solo con firefox su linux. Insomma abbastanza inutile...

    0
Effettua l'accesso per rispondere