Joomla.it Forum
Joomla! 3 => I Template di Joomla! 3 => : mau_develop 13 Jun 2014, 19:40:00
-
due div al 100%...
quello superiore contiene un menu e un fondo colorato
quello sotto altre cose e un immagine/pattern di sfondo ripetuto x y
se al div sopra aggiungo il bordo inferiore shadow lo vedo solamente se il div sotto non ha un immagine di background, altrimenti sembra non applicarlo o non stare sullo stesso livello e quindi coprirlo... in qs ultimo caso non saprei ..è come vedere la luce spenta quando chiudi il frigo :)
why? ... cosa non so?
-
Dimensioni in percentuali entrambi ? Possibile che la shadow aumenti la dimensione ed non rietra più nel 100% ? Prova a darle una dimensioni più bassa in percentuale.
Posta un pò di codice così ho qualcosa da provare.
-
bhe non è che c'è da fare esempi... mi sembra banale e chiaro..
fai un div con un bg colorato al 100%
ne fai un altro sotto con un img di background e a quello sopra imposti uno shadow al bordo inferiore così che l'ombra sormonti il background del div sotto.
quello che succede col box shadow è in pratica la duplicazione del box in una posizione sottostante che io davo per scontato sovrastasse il div sottostante, magari forzando lo z-index di uno e dell'altro... invece non è così
-
Ok.. penso di aver capito cosa chiedevi.. Se è come la foto allegata io ho scritto questo:
HTML
<div class="inferiore">
<div id="superiore" class="superiore-shadow"><>
<>
CSS
.inferiore{
width: 100%;
background: url(/MWC/img.jpg);
height: 150px;
z-index: -2;
position: fixed;
left: 0;
top: 0;
}
#superiore {
background-color: rgb(194, 182, 151);
width: 100%;
height: 90px;
position: absolute;
top: 0;
left: 0;
z-index: 2;
}
.superiore-shadow:after {
content: "";
width: 100%;
height: 1px; /*se metti 0px non ti viene il rigo bianco, come ti piace */
margin-top: 88px;
display: block;
position: absolute;
left: 0;
z-index: 0;
-webkit-box-shadow: 0px 0px 20px 4px rgb(0, 0, 0);
-moz-box-shadow: 0px 0px 20px 4px #000000;
box-shadow: 0px 0px 20px 4px rgb(0, 0, 0);
}
Non so perchè ma il [ code ] non mi chiude i div..
[allegato eliminato automaticamente dopo un anno]
-
caspita funziona! :)
gli z-index li avevo provati .. a dir la verità credo di aver provato di tutto tranne :after che ora vado a vedermi
grazie
-
Perfetto, è stato un piacere ;)
-
non sapevo che l'attributo shadow può anche diventare una pseudoclasse.
Questi css sono sempre più potenti, forse ci vuole un buon libro da studiare.