Grow your CSS skills. Land your dream job.

Select box issue with IE 10

  • # July 12, 2013 at 4:54 am

    HI,

    I have a normal select box as below.

    In IE 10 it behaves differently.

    When u select car for the first time, and the next time when you click to select
    the option car which is selected is highlighted , but the option above/ below car are displayed above/below the selected option.

    This is a default behaviour of IE 10.

    How can we resolve this , as the dropdown to work like previous IE versions.

    # July 12, 2013 at 7:34 am

    Just curious, why is this an issue?

    # July 12, 2013 at 7:43 am

    In all browsers except IE 10 , all the select options drop down below the selection area.

    Whereas in IE 10. when u select middle options, all the options above the selected area are opened above and the below ones are below the select area.

    Although it is an advanced feature, it breaks the uniformity.

    Another issue is the delete icon (X) appearing at the end of the input box in IE10 , which clears the typed text.
    we can disable the feature by adding
    input[type=text]::-ms-clear{
    display:none;
    }

    I am looking for a similar code to disable the new advanced IE10 feature.

    # July 12, 2013 at 7:54 am

    >Although it is an advanced feature, it breaks the uniformity.

    True but the **vast** majority of viewers will only be using a single browser so they won’t notice a difference.

    I’m not sure that there is a CSS property that can change the **functionality** of the select box rather than the appearance.

    Changing the default behavior would, I suspect, involve a JS solution….but I’ll see what I can find.

    # July 12, 2013 at 3:38 pm

    I had checked this before publishing.
    They dont solve the issue
    You check the behaviour using the link
    [Your text to link here...](http://codepen.io/gowda24/pen/DnxlK )

    open the link in browser stack , with windows 7 and IE10

    # July 12, 2013 at 3:42 pm

    >They dont solve the issue

    As I said…

    >**Doesn’t appear to be a solution.**

    Guess you’ll just have to deal with it.

Viewing 7 posts - 1 through 7 (of 7 total)

You must be logged in to reply to this topic.

*May or may not contain any actual "CSS" or "Tricks".