Variable Visions

Articles CSS Box-Shadows-in-all-browsers


tutorials - CSS and Web-Development.

Box Shadows in all browsers

Published Thu. Sep. 20, 2012


YOU NEED THE POSITIONING, BACKGROUND COLOR, HEIGHT, and THE BLUR FILTER IN ORDER TO WORK IN IE…A LITTLE WACKY WHEN APPLYING A SHADOW TO AN ELEMENT THAT SPANS 100%…THE ADDED SHADOW CAUSED A HORIZONTAL SCROLL SINCE IT IS GOING PAST 100%…99% FIXED BUT OVERFLOW HIDDEN DIDNT WORK FOR ME
(ONLY WORTH DOING IF THE SHADOW IS NECESSARY IN IE 8 AND PREVIOUS)

#topwrapper {
    /* position: relative; */
    width: 99%;
    /* overflow: hidden; */
    height: 140px;
    background: #FFF;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.8);
    filter:    progid:DXImageTransform.Microsoft.Blur(PixelRadius='5', MakeShadow='true', ShadowOpacity='0.40');
    zoom: 1;
}
#top {
    position: absolute;
    width: 100%;
    margin: 0px;
    background: url(/getfile.php/1825005.2055.ccrqrrqsts/header-bg.jpg) repeat-x top;
    border-bottom: 5px solid #000000;
}




RECENT ARTICLES:

PUBLISHED ON 03.3.20arrowWordpress and Woocommerce widget for inserting PHP in Elementor

PUBLISHED ON 09.5.19arrowWordpress and Woocommerce redirect to a product page from categories with a single product

TAGS

CATEGORIES