html - CSS not working in Non-firefox browsers in tag

Question

my css code is

.sele {
    -webkit-transform:scale(0.8);
    -moz-transform:scale(0.8);
    -webkit-transition-duration: 0.3s;
    -moz-transition-duration: 0.3s;
    -o-transition-duration: 0.3s;
    opacity: 0.75; 
    margin: 0 10px 5px 0; 
}
.sele:hover {
    -webkit-transform:scale(1.1);
    -moz-transform:scale(1.1);
    -o-transform:scale(1.1);
    box-shadow:0px 0px 30px gray; 
    -webkit-box-shadow:0px 0px 30px gray; 
    -moz-box-shadow:0px 0px 30px gray; 
    opacity: 1; 
}

I am using it in <option> tag but it is working only with Mozilla Firefox and not with others. you can browse this live at http://jsfiddle.net/baibav/D5Fdq/5/

Answer 1

尝试这个

.sele {
    transform:scale(0.8);
    -webkit-transform:scale(0.8);
    -moz-transform:scale(0.8);
    transition-duration: 0.3s;
    -webkit-transition-duration: 0.3s;
    -moz-transition-duration: 0.3s;
    -o-transition-duration: 0.3s;
    opacity: 0.75; 
    margin: 0 10px 5px 0; 
}
.sele:hover {
    transform:scale(1.1);
    -webkit-transform:scale(1.1);
    -moz-transform:scale(1.1);
    -o-transform:scale(1.1);
    box-shadow:0 0 30px gray; 
    -webkit-box-shadow:0 0 30px gray; 
    -moz-box-shadow:0 0 30px gray; 
    opacity: 1; 
}