Home > DeveloperSection > Forums > how to remove browsers background selection color for images and text?
Royce Roy
Royce Roy

Total Post:134

Points:938
Posted on    February-26-2013 4:51 AM

 CSS-CSS3 CSS-CSS3 
Ratings:


 1 Reply(s)
 1036  View(s)
Rate this:

Hi Guys

I have display images in my webpage and these image will be change on over image click. Problem is that, when user click (mostly continue) on image for change, image's background (in blue color) are selected in every browser.

This problem will be same for checkbox, dropdown, radio button and any clickable control . This is very irritable. Please help me!

Thanks 



AVADHESH PATEL

Total Post:604

Points:4228
Posted on    February-26-2013 7:47 AM

Hi Royce!

Use below css, that prievnt to select background on click. use "unselectable" class where you control are difine.

.unselectable
{
 -webkit-user-select: none;
 -khtml-user-drag: none;
 -khtml-user-select: none;
 -moz-user-select: none;
 -moz-user-select: -moz-none;
 -ms-user-select: none;
 -o-user-select: none;
 user-select: none;
}

way of using

<div class="unselectable">
    <input type="checkbox" id="chk" style="width: 25px; height: 25px; background-color:#E5E5E5;" />
    <label  for="chk" id="lblChk" style="vertical-align:super;">
        Product</label>
</div>


Don't want to miss updates? Please click the below button!

Follow MindStick