CSS vor und nach nicht mit Parallaxe arbeitet

Ich versuche vor anzuwenden und nach für mein div-Element, das ein Parallaxenelement istCSS vor und nach nicht mit Parallaxe arbeitet

<div id="OurPhilosophy" class="parallax-window" data-parallax="scroll" data-image-src="https://cdn6.bigcommerce.com/s-jhmi7y5v2c/product_images/uploaded_images/525231494.jpg?t=1489982505">

aber meine vor und nach nicht angewandt werden, nicht ich sie sehe, wenn Ich inspiziere Element in Chrom.

Hier ist meine CSS:

#OurPhilosophy:before { 
    position: absolute; 
    width: 100%; 
    left: 0; 
    top: -149px; 
    height: 200px; 
    background: #fff; 
    transform: skewY(-3deg); 
    -moz-transform: skewY(-3deg); 
    -webkit-transform: skewY(-3deg); 
    -ms-transform: skewY(-3deg); 
} 

#OurPhilosophy:after { 
    position: absolute; 
    width: 100%; 
    left: 0; 
    bottom: -149px; 
    height: 200px; 
    background: #fff; 
    transform: skewY(3deg); 
    -moz-transform: skewY(3deg); 
    -webkit-transform: skewY(3deg); 
    -ms-transform: skewY(3deg); 
}

Quelle

2017-03-22 user979331

:: vor :: after statt: vor: nach – Mindless

Nö, die nichts taten, interessante Entdeckung, wenn ich verwende: oder :: es appys es meine Fußzeile, seltsam – user979331

weil :: beofre oder :: nachdem es Inhalt vor oder nach dem Div hinzufügen, also was ist nach dem div? die Fußzeile nehme ich an? – Mindless

Add css dann versuchen:

#OurPhilosophy:before, 
#OurPhilosophy:after { 
    content:''; 
}

Quelle

2017-03-22 04:43:25

nein, das hat nicht funktioniert – user979331

das ist fiddle url gucken. https://jsfiddle.net/AwadheshVerma/qemrb1ob/ das funktioniert –

Ich sehe die jsfiddle funktioniert, aber egal was ich tue, es hält es auf die Fußzeile – user979331

#OurPhilosophy:before { 
 
    position: absolute; 
 
    width: 100%; 
 
    left: 0; 
 
    \t content;""; 
 
    top: -149px; 
 
    height: 200px; 
 
    background: #999; 
 
    transform: skewY(-3deg); 
 
    -moz-transform: skewY(-3deg); 
 
    -webkit-transform: skewY(-3deg); 
 
    -ms-transform: skewY(-3deg); 
 
} 
 

 
#OurPhilosophy:after { 
 
    position: absolute; 
 
    width: 100%; 
 
    left: 0; 
 
\t content;""; 
 
    bottom: -149px; 
 
    height: 200px; 
 
    background: #555; 
 
    transform: skewY(3deg); 
 
    -moz-transform: skewY(3deg); 
 
    -webkit-transform: skewY(3deg); 
 
    -ms-transform: skewY(3deg); 
 
}

<div id="OurPhilosophy" class="parallax-window" data-parallax="scroll" data-image-src="https://cdn6.bigcommerce.com/s-jhmi7y5v2c/product_images/uploaded_images/525231494.jpg?t=1489982505">

Quelle

2017-03-22 06:16:28

#OurPhilosophy::before { 
 
    position: absolute; 
 
    width: 100%; 
 
    left: 0; 
 
\t content:""; 
 
    top: -149px; 
 
    height: 200px; 
 
    background: #555; 
 
    transform: skewY(-3deg); 
 
    -moz-transform: skewY(-3deg); 
 
    -webkit-transform: skewY(-3deg); 
 
    -ms-transform: skewY(-3deg); 
 
} 
 

 
#OurPhilosophy::after { 
 
    position: absolute; 
 
    width: 100%; 
 
    left: 0; 
 
\t content: ""; 
 
    bottom: -149px; 
 
    height: 200px; 
 
    background: #999; 
 
    transform: skewY(3deg); 
 
    -moz-transform: skewY(3deg); 
 
    -webkit-transform: skewY(3deg); 
 
    -ms-transform: skewY(3deg); 
 
}

<div id="OurPhilosophy" class="parallax-window" data-parallax="scroll" data-image-src="https://cdn6.bigcommerce.com/s-jhmi7y5v2c/product_images/uploaded_images/525231494.jpg?t=1489982505">

Quelle

2017-03-22 06:20:16

CSS vor und nach nicht mit Parallaxe arbeitet

Antwort

Verwandte Themen