Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS Background color not showing in IE8? Why??

  • This topic is empty.
Viewing 10 posts - 1 through 10 (of 10 total)
  • Author
    Posts
  • #43213
    Joejacks
    Participant

    Hi

    On the following code does anyone have any ideas why the background image and colour is not showing up in IE8, it works fine in IE9, Chrome, Firefox etc

    Code Snippets are shown below, it’s really frustrating so I would appreciate any fix for this please

    CSS Code Snippet

    HTML Web snippet

    #127333
    Paulie_D
    Member

    typo?

    navi#top

    #127341
    Senff
    Participant

    Yup. <NAVI> is not an HTML element that IE8 understands.

    #127353
    Joejacks
    Participant

    Sorry it should say

    #127410
    Paulie_D
    Member

    Well fix that and you’re set.

    #127423
    Kitty Giraudel
    Participant

    By the way: don’t qualify your selectors. Especially when using ID.

    #127516
    Joejacks
    Participant

    I have and it still is not working. Is

    If this is the case, how can I build in the functionality required so the menu background shows in IE8 and below

    #127517
    Paulie_D
    Member

    Have you linked in the HTML5 Shiv?

    I would do that but a quick fix would be to change [nav] to [div]

    #127526
    Anonymous
    Inactive

    One other thing that might help is clearing the floats you have set on your menu items.

    There are a couple methods to do this. First is you add a div with a class of clear (class could be anything really) after the list item just before the closing ul tag (if the menu in generated place before the closing nav tag). Then in your stylesheet add a rule for clear with an attribute of clear both.


    .clear { clear: both; }

    Another method that has less browser support (does not work in old IE) is to use a pseudo element instead of an extra div to clear.

    nav ul:after {
    content: “”;
    display: table;
    clear: both;
    }

    This may not solve the issue outright however, I would do as Paulie_D suggests and include HTML5Shiv on your page too. Place the following in your head to get HTML5 tag support in old versions of IE.

    src=”http://html5shiv.googlecode.com/svn/trunk/html5.js&#8221;

    EDIT: I just can NOT get the code highlighter working like it should! *grumble*

    #127835
    Joejacks
    Participant

    Many thanks the HTML5Shiv did the trick

    The only issue I have now is when viewing the menu on iPAD/touch screen tablets when pressing the menu item which fires the mega menu, when pressing the link to open the menu, the mega menu appears briefly but then the resulting page loads so the user is unable to access any of the links in the drop down menu.

    Is there a way to stop this or to show an Ipad only menu? or can the nav be adjusted to cater for touch screen tablets?

Viewing 10 posts - 1 through 10 (of 10 total)
  • You must be logged in to reply to this topic.