Background color not showing in IE8

Hello CSS Experts.

I have  a div that has a white background color.  It's working fine -- except it is showing up on IE8 as transparent.  

In my next comment I will include the link  to the development site.

The div is named div.inner clearfix

It is controlled by this css in custom.css

#main > div.inner {
    background: none repeat scroll 0 0 #ffffff;
    border: 10px solid #ffffff;
    border-radius: 10px 10px 20px 20px;
}

Looking forward to fixing this IE8 compatibility issue!

Thanks!

Rowby
LVL 9
Rowby GorenAsked:
Who is Participating?
 
GaryConnect With a Mentor Commented:
Take all this
<div id="banner">
    <div class="inner clearfix">
      <div class="logobloc" id="bannerlogo">
        <div class="inner clearfix">
                      <img width="788" height="173" alt="" src="/templates/hasonrevised/images/hason-header.png">
                            </div>
      </div>
    </div>
  </div>

Open in new window


and replace with
<img width="788" height="173" alt="" src="/templates/hasonrevised/images/hason-header.png">

Open in new window

0
 
Rowby GorenAuthor Commented:
Here's the link to the development site:

Click for development site

Thanks!
0
 
Scott Fell, EE MVEDeveloper & EE ModeratorCommented:
0
Get expert help—faster!

Need expert help—fast? Use the Help Bell for personalized assistance getting answers to your important questions.

 
GaryConnect With a Mentor Commented:
Add an !important to the color. Hard to tell where it is being overridden since you have !important all over the place.

p.s. do you really need 22 css files?
0
 
Rowby GorenAuthor Commented:
HI

#main > div.inner {
    background: none repeat scroll 0 0 #FFffff !important;
    border: 10px solid #FFffff !important;
    border-radius: 10px 10px 20px 20px;
}

fixed it.  Thanks.

One more question.  I am seeing another IE 8 compatibility issue.  There is a banner at the top named hason-header.png.  It is also not showing in my copy of IE8.  It's "invisible"

The image is embedded in the html and I don't see it in any css specifically controlling it...
<div class="inner clearfix">
<img width="788px" height="173px" alt="" src="/templates/hasonrevised/images/hason-header.png"></div>

Open in new window


Your thoughts?

Thanks

Rowby
0
 
GaryConnect With a Mentor Commented:
width/height doesn't use px (when used inline like that) - just the put the number in and nothing else
0
 
Rowby GorenAuthor Commented:
HI

I replaced it with the following html

<img width="788" height="173" alt="" src="/templates/hasonrevised/images/hason-header.png">

Open in new window


But it is still not showing in IE8.   Should I just remove the height and width attributes altogether?

Or should I do the header image via css for better compatibility???

Thanks

Rowby
0
 
Rowby GorenAuthor Commented:
p.s. do you really need 22 css files?   Hee hee!   Obviously not, but for now I'm "stuck" with them..  :)

Thanks again.  BTW I have another css question here if you have time to dig into  it...

http://www.experts-exchange.com/Web_Development/Web_Languages-Standards/CSS/Q_28278460.html
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.