Sovrapporre mezza immagine ad un div (o altro elemento).

[Darkan85]

Salve a tutti.
Vi espongo subito il mio problema.
Ho un'immagine a forma di triangolo con la punta in giù.
E ho un bandone centrale che attraversa tutta la pagina.
Questo triangolo parte fuori dal bandone centrale. Ma la sua punta inferiore arriva sul bandone in questione.

Come fare?
Le sto provando tutte ma non mi viene (sempre che sia possibile).

 

[Fez Vrasta]

Se ci dessi del codice su cui lavorare potremmo capirci qualcosa.
Senza codice ti posso consigliare di usare l'attributo CSS margin e vedere di spostare l'elemento usando margini negativi o positivi uni-direzionalmente.

 

[Darkan85]

Ma se uso i margini, ottengo solo di spostarlo giusto? Io invece voglio che sia metà sopra al verde.

 

[Darkan85]

Ho un codice davvero pieno di css. Vi può essere utile lo stesso?
E' per questo che per ora non l'ho postato!

 

[criric]

prova con la proprieta z-index
al contenitore verde gli assegni un numero piu basso

 

[Darkan85]

Purtroppo non cambia niente con gli z-index!

 

[criric]

            img {
                z-index: 10;
            }
            div.bandoneverde {
                z-index: 9;
            }

hai fatto cosi?
posta un po di codice

 

[Jonn]

Una soluzione più semplice sarebbe creare un div largo come la parte verde e alto come la parte verde che va allineata in basso più la parte trasparente che va posizionata in alto, gli dai come sfondo del div la suddetta immagine e dentro il div ci metti il triangolo con il codice <img />.

div#nome {width: 100%; height: 100px; background: url('immagineverde.png')repeat-x bottom;}

<div id="nome">
     <img src="immaginetriangolo.png" alt="triangolo"/>
</div>