Visualizzazione dei risultati da 1 a 3 su 3
  1. #1
    Utente di HTML.it L'avatar di bb2
    Registrato dal
    Aug 2009
    Messaggi
    3

    Problema z-index (suppongo....)

    Ciao!!!

    Da molto tempo leggo html.it, e ho imparato taaaante cosine belle.... ma ora ho un problema che nemmeno leggendo le guide, i forum, gli articoli.... nada....

    Allora, il mio problema è quello di sovrapporre dei div, e allora ho fatto così:

    <div id="ln2" class="lnbox">
    <div id="ln1_head" class="lnlabel">
    codice php per prendere la categoria di un post (wordpress)
    </div>

    <div id="ln1_pict" class="lnpict">
    codice php per prendere un'immagine di un post (wordpress)
    </div>

    <div id="ln1_txt" class="lnpicttitle">
    codice php per prendere il titolo del post
    </div>
    </div>

    E nel CSS ho fatto:

    .lnbox {width:234px;height:140px;background-color:#FFFFFF;border: 1px solid #666666;margin-right:12px;float:left;}

    .lnlabel {height:20px;color:#FFFFFF;background-color:#990000;border-bottom:1px;padding-left:10px;}

    .lnpict {height:120px;width:234px;overflow:hidden;position :relative;top:0px;z-index:1;}

    .lnpicttitle {height:40px;width:224px;background-image:url(images/bkg1.png);background-repeat:repeat-x;padding:0 5 0 5;position:relative;top:-45px;z-index:2;}

    dove bkg1.png è un'immagine semitrasparente che si sovrappone all'immagine principale (sopra la quale ci va il titolo del post).

    Arrivo al punto. Il risultato della pagina sembra corretto, la visualizzazione insomma è ok. Ma se faccio un'analisi della pagina (con web developper, add-on di firefox) pare che il div principale (il contenitore) scenda di circa 40px in più di dove dovrebbe fermarsi....

    Spero di essermi spiegato... . Qualcuno mi sa dire qualcosa??
    Graaaazie milleeee

  2. #2
    Frontend samurai L'avatar di fcaldera
    Registrato dal
    Feb 2003
    Messaggi
    12,924
    si è corretto.

    immagina che quando posizioni un elemento in relative e lo sposti di tot px, al rendering della pagina quell'elemento occupa lo spazio che dovrebbe occupare se fosse static e poi viene "trascinato" nella direzione desiderata attraverso top, left, right o bottom lasciando un buco sul posto occupato originariamente


    se cambi a esempio da
    top: -45px

    a
    margin-top: -45px;

    eviti questo problema
    Vuoi aiutare la riforestazione responsabile?

    Iscriviti a Ecologi e inizia a rimuovere la tua impronta ecologica (30 alberi extra usando il referral)

  3. #3
    Utente di HTML.it L'avatar di bb2
    Registrato dal
    Aug 2009
    Messaggi
    3

    grandioso

    Grandioso!!!!!!! Effettivamente adesso è perfettamente ok!!!!!
    Grazie mille

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 © 2026 vBulletin Solutions, Inc. All rights reserved.