Windows Phone 8 Highlight Colors In Input Fields

in internet explorer 10 (mobile version), a selectbox () gets highlighted blue as soon as it gets focused, (it´s the blue of the whole Modern UI surface of the phone). the styles

Solution 1:

I've encountered a similar problem on WP7 an WP8, the solution is to move focus from select box to fake input on click event.

jQuery:

$('select').on('click', function() {
    $('input.fakeInput').focus().blur()
})

CSS:

.fakeInput {
    display: block;
    width:0;
    height:0;
    top: -999rem;
    position: absolute;
}

Note: do not forget to add this code only for mobile device, on desktop browsers it will work not as expected.

Solution 2:

IE has its own CSS pseudo-element to deal with this highlight.

CSS:

select::-ms-value{ background-color: transparent; color: black; }

You may read more about this on this page.

Solution 3:

it´s interesting but since I add this line to my style sheet, it keeps highlighting blue, but doesn´t stay that way after you select something from the selectbox.

Thought I add it as an answer if somebody comes back with the issue.

:focus{outline: none;}