ie7 and ie8 issues

[cre8tive1]

Hi all,

I’m finishing up a website and trying to resolve browser issues.

In IE7 & 8, the RGBa color values are not working. I thought I remembered there being a way to set a secondary background color for browsers that don’t support RGBa, but I haven’t been able to get any to work. Any suggestions?

In IE8, the top margin value for

is not working, so the NAV div is collapsing to the bottom of the DIV above it. Any suggestions?

Here is the DEV site

[TheDoc]

As far as I can tell, you haven’t set up fallback colors: https://css-tricks.com/2151-rgba-browser-support/

[cre8tive1]

I”ve added in the fallback colors as below but they still don’t work in IE7

{background-color: #231208; background-color:rgba(35,18,8,0.6);}

[wolfcry911]

you could do a couple different things to fix the margin problem. You could set the nav to position: absolute and bottom: 0; with the header position: relative. Or you could give the floats a bottom margin instead of a top margin to the nav. You can lose the extraneous empty div for clearing also (bad mark-up), just place a clear on the nav (not needed if using the AP).

[cre8tive1]

I was able to fix it by adjust the bottom margin for “phone-location” as you suggested. I hate using the empty div for clearing, but have never been able to get anything else to work consistently.

Still stuck on the fall back color for IE7.

[wolfcry911]

the fallback only works when using short-hand, ie change to:

{ background: #231208; background: rgba(35,18,8,0.6); }

edit// I stand corrected, the above should be true for an rgb fallback but not for a hex fallback. Another way to fix is to duplicate the selector like so:

#nav { background-color: #231208; }

#nav { background-color: rgba(35,18,8,0.6); }

[cre8tive1]

Ah, using short-hand for both worked. I “love” all the quirky tidbits to remember with web design.

 { background: rgb(35,18,8); background: rgba(35,18,8,0.6); }

[Author]

Posts