contacts

Get All 146 Premium WordPress Themes for Just $59.99
One-Time Payment: Unlimited Use Across Unlimited Domains, Plus Free Lifetime Updates! Learn more

Remove Box Shadow (Border) Effect for Images

Remove Box Shadow (Border) Effect for Images

By default most of our WordPress themes (both Free and Premium) comes with box shadow (border) effect around them. In some cases you may want simply to remove that effect. Here are all of the necessary instructions how it can be done:

1. Login to Admin Panel and navigate to Left Menu -> Appearance -> Theme Editor

2. Open style.css

3. Find the following code and remove the code marked in bold below:

#home-content-wrapper img,
#main-content-wrapper img,
#footer-main img {
max-width:100%;
height:auto;
-webkit-box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.3);
-moz-box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.3);
box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.3);

}

#home-content-wrapper a:hover img,
#main-content-wrapper a:hover img,
#footer-main a:hover img {
-webkit-box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.7);
-moz-box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.7);
box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.7);
opacity:0.7;
}

4. Save Changes

Also, in case you want to remove the box shadow effect for page borders:

box shadow page

it can be done in a similar way:

1. Login to Admin Panel and navigate to Left Menu -> Appearance -> Theme Editor

2. Open YourTheme/inc/actions.php

3. Find the following code and DELETE it:

if ( $isBoxedLayoutSelected ) {
    
        $custom_css .= ‘ #body-content-wrapper{box-shadow: 0 0 10px #000000;}’;
    }

4. Save changes

 

One Response to “Remove Box Shadow (Border) Effect for Images”