IE10 Compatibility Issues on Site

Site is this:

dev.angelakeiser.com

I am ready to launch, but in IE10 there are some major issues with how things are loading.

Home page: dev.angelakeiser.com
1. The "looking for a home loan" button is shifted up and is slightly covering the "bill pay" button.
2. The lines under the menu buttons on the left do not look the same nor do they look like they are quite positioned correct - look a little to far to the right?

Out Staff: http://dev.angelakeiser.com/our-staff/
1. Mark Keiser and John Hohlen pictures are being cutoff

Loan: http://dev.angelakeiser.com/loans/
2. The contact a loan officer online box is not working.

Any insight would be appreciated. Thanks so much!

  • Patrick

    Hi @akeiser

    Welcome to the forums!

    I believe the problem is that each of those image menu items has a specific margin value applied, and the last one has a negative margin value. IE doesn't like negative margins. :slight_smile:

    Remove this from your style-sheet:

    #navbar li:last-child {
        border-top: 0 solid #343434;
        margin: auto;
    }

    And remove the margin values from these:

    li#menu-item-128 a
    li#menu-item-168 a
    li#menu-item-393 a

    Then apply height & margin values to the list items instead, like so:

    li#menu-item-128, li#menu-item-168, li#menu-item-393 {
    height:60pz;
    margin:10px 0 0;
    }

Thank NAME, for their help.

Let NAME know exactly why they deserved these points.

Gift a custom amount of points.