Stephen
Stephen

Reputation: 4813

IE8 / 7 - Issue with div shadows / borders appearing

I'm having an issue with a client website, there are shadows or borders appearing around divs in the header. I don't actually want these and don't know how to get rid of them. This is only happening in IE7 / 8. IE9, Firefox, Safari and Chrome are all fine. Site is go-movil.es

Any help appreciated.

Regards, Stephen

Upvotes: 2

Views: 597

Answers (2)

nadavy
nadavy

Reputation: 1805

@Stephen- I was in the website in Chrome and saw the shadow (in the menu). That's caused by css rule that's includes:

-moz-box-shadow: 0 0 5px 5px #55859b;
-webkit-box-shadow: 0 0 5px 5px#55859b;
box-shadow: 0 0 5px 5px #55859b;    

The rule causes the Shadow to show in FF, Chrome, IE9 and NOT in IE7/IE8. If you want to remove the shadow just remove it from User.php & style.css.

Cheers, Nadav

Upvotes: 1

Caleb Doucet
Caleb Doucet

Reputation: 1781

If you only want the shadows to show up in everything but ie7/8 you can use conditional comments to implement a specific css that has styles that clear the shadows.

in head of html:

<!--[if lte IE 8]><link rel="stylesheet" href="lte-ie-8.css"><![endif]-->
<!--[if lte IE 7]><link rel="stylesheet" href="lte-ie-7.css"><![endif]-->

css (lte-ie-8.css and lte-ie-7.css):

body > header .nav > li.current-menu-item > a, body > header .nav 
> li.current-menu-ancestor > a, body > header .nav > li.current-page-ancestor 
> a, body > header .nav > li.current_page_parent > a
{
    box-shadow: none;
}

source: http://mathiasbynens.be/notes/safe-css-hacks

Hope this helps

Upvotes: 1

Related Questions