DIVs che non si sovrappongono

[supermac]

Premetto che sono una schiappa coi css.
Con riferimento al codice che segue (che è il sorgente della pagina renderizzata in Firefox):

<div class="album" style="position:absolute;background-image: url('/images/demo/albums/4/newsl.jpg'); background-repeat: no-repeat; background-position: center center; background-size: cover;height:100%;">
 
    <div style="position:relative;z-index:80;top:0px;left:0px;width:100%;height:100%;cursor:pointer;">
        <ul class="lightgallery">
            <li data-src="/images/demo/albums/4/newsl.jpg"></li>
        </ul>
    </div>

    <div style="position:relative;z-index:5;top:0px;left:0px;width:100%;height:100%;"><h3>work2 ENG</h3>
    <p>descr lavoro numero due fantastico lavoro marveloussss</p>
    </div>

</div>

c'è un motivo evidente (che io non vedo) per cui i due layer contenuti nel div con class='album' non si sovrappongono tra loro?
Io vorrei semplicemente che occupassero tutto lo spazio disponibile nel layer 'album' e che quello che contiene l'ul con classe lightgallery stesse sopra all'altro che contiene solo testo.

[KillerWorm]

Ciao

c'è un motivo evidente (che io non vedo) per cui i due layer contenuti nel div con class='album' non si sovrappongono tra loro?

Il motivo è da ricercare nella proprietà position e relativi valori (static, relative, absolute, fixed) che è possibile attribuirgli.
Posso innanzitutto consigliarti di dare uno sguardo a qualche guida per chiarire questi concetti. Può esserti utile dare uno sguardo tra i Link utili CSS al capitolo 2, sotto l'argomento Position.

In particolare fai attenzione a come il valore relative agisce su un elemento. Questo infatti fa riferimento alla loro relativa posizione iniziale. Per tale motivo, applicando top:0px e left:0px ai due div che hanno position:relative, non noterai alcuna differenza rispetto a come sarebbe normalmente.

Probabilmente, per quei due div, dovresti piuttosto impostare position:absolute, che li rende "relativi" al loro contenitore (se questo non è static). Fai però attenzione perché in questo caso, quegli elementi, sono rimossi dal normale flusso dei contenuti, per cui il loro contenitore potrebbe collassarsi. Bisognerebbe comunque vedere il contesto per poter valutare meglio il tutto.

Se non riesci a risolvere, attribuendo semplicemente position:absolute ai due div, o se incontri ulteriori problematiche, prova a postare il link alla pagina pubblica (se possibile) e spiegare esattamente cosa intendi ottenere.

[supermac]

grazie!