[Okta Webinar] Learn how to a build a cloud-first strategyRegister Now

  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 333
  • Last Modified:

the legend is not showing in compatibity view of i8

My div shows fine in ie8 but does not show in compatibilty mode of ie8.
I have this in the div:

<div id="calendar-leg">
                                    <h4>Colors indicate types of special days. Roll over for details.</h4>
                                    <ul >
                                        <li id="points-earned">Points earned</li>
                                        <li id="sale-bonus">Special Sale/Bonus</li>
                                        <li id="member-events">Member Event</li>

and following is the css

 #calendar-leg ul li {
background: url("/_vcontent/images/legend-bg.png") no-repeat scroll 0 0 transparent;
    float: left;
    line-height: 30px;
    margin-right: 20px;
    padding-left: 40px;
      font-weight: bold;
      font-size: 12px;

 #calendar-leg h4 {
 text-align: center;
 margin: 7px 0;

 #calendar-leg ul {
 width: 490px;
 margin: 0 auto;

 #calendar-leg ul li#sale-bonus {
 background-position: -158px 0;

 #calendar-leg ul li#member-events{
 background-position: -352px 0;
  • 2
1 Solution
Is there anyway we can view the site?
Tom BeckCommented:
Can you be more specific?
ssnmAuthor Commented:
I do not see anything when I turn the compatibilty mode on for this whole div.  But you can see the contents, how is it so.

Tom BeckCommented:
I pasted the markup and css you provided into a new htm page to get the results in the screen shot. My guess would be that there is something else on your actual page that is causing the issue you are seeing. You have this question in the jquery and javascript zones. Is there client side script on the actual page? That could cause issues. Can you post the whole markup here?

Featured Post

How to Use the Help Bell

Need to boost the visibility of your question for solutions? Use the Experts Exchange Help Bell to confirm priority levels and contact subject-matter experts for question attention.  Check out this how-to article for more information.

  • 2
Tackle projects and never again get stuck behind a technical roadblock.
Join Now