Welke browsers ondersteunen schaduw in css
Ik ben bezig om een layout te maken voor een website. Nu wil ik aan mijn divs misschien een beetje schaduw toevoegen, alleen voordat ik dat doe wil ik eerst weten welke browsers/browserversies dit allemaal ondersteunen. Weet iemand hier een antwoord op?
Gr. Tijs
Code (php)
1
2
3
4
5
6
2
3
4
5
6
.box_shadow {
-webkit-box-shadow: 2px 2px 4px #2d2d2d; /* Saf3-4, iOS 4.0.2 - 4.2, Android 2.3+ */
-moz-box-shadow: 2px 2px 4px #2d2d2d; /* FF3.5 - 3.6 */
box-shadow: 2px 2px 4px #2d2d2d; /* Opera 10.5, IE9, FF4+, Chrome 6+, iOS 5 */
filter: progid:DXImageTransform.Microsoft.Shadow(color='black', Direction=145, Strength=4) /* IE5.5 - IE8 */
}
-webkit-box-shadow: 2px 2px 4px #2d2d2d; /* Saf3-4, iOS 4.0.2 - 4.2, Android 2.3+ */
-moz-box-shadow: 2px 2px 4px #2d2d2d; /* FF3.5 - 3.6 */
box-shadow: 2px 2px 4px #2d2d2d; /* Opera 10.5, IE9, FF4+, Chrome 6+, iOS 5 */
filter: progid:DXImageTransform.Microsoft.Shadow(color='black', Direction=145, Strength=4) /* IE5.5 - IE8 */
}
Meer uitleg over het IE filter voor oude IE versies: http://msdn.microsoft.com/en-us/library/ms533086(v=vs.85).aspx
Bij het gebruik van de goede codering kun je shadow in alle browsers krijgen.
Zelf in ie6 + ie7 en ie8 waar dit standaard nog niet door de browser werd ondersteund.
Tevens zie de commentaar regels achter elke code bij Wouter. Die geeft aan welke browser welke code ondersteund.
Gewijzigd op 20/04/2012 17:37:29 door Frank WD