Hey,
ich hab einen Header, der zum Herausstechen einen leichten Schatten hat.
.head {
width: 100%;
max-width: 100%;
margin-left: auto;
margin-right: auto;
margin-top: 3.5%;
display: flex;
justify-content: center;
align-items: flex-end;
padding-bottom: 1.25%;
-webkit-box-shadow: 0px 4px 3px 0px rgba(0,0,0,0.4);
-moz-box-shadow: 0px 4px 3px 0px rgba(0,0,0,0.4);
box-shadow: 0px 4px 3px 0px rgba(0,0,0,0.4);
overflow-x: hidden;
position: relative;
z-index: 10;
}
Darunter ist farblicher Bereich, den ich folgendermaßen angelegt habe bzw. diese Class-Details gegeben habe:
.artikelover {
width: 100%;
position: relative;
background-color: crimson;
z-index: 1;
}
.artikelover:before {
display: block;
content: „“;
padding-top: 20%;
z-index: 1;
}
In Firefox sieht man den Schatten des Headers, in Google Chrome nicht.
Wo ist mein Fehler?