• Resolved nickmeul

    (@nickmeul)


    Hi guys,

    As the title shows, I’ve got a problem which only occurs in IE.
    The layout of my website seems to be different in IE, and after a lot of reading i have now created a different stylesheet only for IE. This helped me in editing the layout of my menu etc when IE is used.

    The problem is, that the menu is overlapping the header image in IE, so i would like to position my menu a bit downwards. So I wanted to change my CSS for my menu but nothing happened. It seems, even in IE, it is still using my normal stylesheet for just the menu, since i was able to change other elements with my IE stylesheet.

    Is there a way to fix this problem?

    My website is https://www.perfectcatering.nl.

    Thanks in advance!

    Nick

Viewing 9 replies - 16 through 24 (of 24 total)
  • Thread Starter nickmeul

    (@nickmeul)

    Okay, i placed the script just before </body>, i tried placing it in the header too, nothing seems to change the IE10 display for me, nothing has changed.. is there anything else I can do? or is this script just not right?

    Thread Starter nickmeul

    (@nickmeul)

    I came across this comment:

    Both solutions posted here (with slight modifications) work:

    <!–[if !IE]><!–><script>if(/*@cc_on!@*/false){document.documentElement.className=’ie10′;}</script><!–<![endif]–>

    or

    <script>if(Function(‘/*@cc_on return 10===document.documentMode@*/’)()){document.documentElement.className=’ie10′;}</script>

    You include either of the above lines inside of head tag of your html page before your css link. And then in css file you specify your styles having “ie10” class as a parent:

    .ie10 .myclass1 { }

    And voilà! – other browsers stay intact. And you don’t need jQuery. You can see the example how I implemented it here: https://kardash.net.

    Can you please explain me what he means with the Bold part, what is the code i have to add to my css?

    Thanks in advance

    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    Providing the JavaScript has worked, the <html> element will have a class named, “ie10” and therefore can be referenced to using CSS. You can then apply certain styles to elements only within IE10.

    Thread Starter nickmeul

    (@nickmeul)

    So in practice:

    I need to change the margin-top to 98px. does this mean i have to add:

    .ie10 #branding #access, #colophon #access-footer {
        background: none repeat scroll 0 0 #3D3D3D;
        clear: both;
        display: inline;
        float: left;
        margin-bottom: 2px;
        margin-top: 98px;
        width: 100%;
    }

    to my style.css?

    this was the original code:

    #branding #access, #colophon #access-footer {
        background: none repeat scroll 0 0 #3D3D3D;
        clear: both;
        display: inline;
        float: left;
        margin-bottom: 2px;
        margin-top: 52px;
        width: 100%;
    }
    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    Yes, if that CSS was in your IE stylesheet, then you’d just use the same code and prepend the .ie10 class to your selectors (as exampled by you). Instead of being in an IE stylesheet, it would be in your actual stylesheet for other browsers.

    Thread Starter nickmeul

    (@nickmeul)

    Yesss! got it working for IE10, now i just have to check IE9 when I’m home. Thanks!

    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    You’re welcome ??

    Thread Starter nickmeul

    (@nickmeul)

    Also working on IE9 now! thanksss

    (donation is on its way:))

    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    Thanks! ??

Viewing 9 replies - 16 through 24 (of 24 total)
  • The topic ‘In IE, Not always the stylesheet created for IE is used.’ is closed to new replies.