Advanced Search

Return to Snippet

Revision: 66064
at March 8, 2014 05:27 by eklemen
Initial Code 
// Only style selects for ie10 and good browsers
.gt-ie9 {

    // be aware: this class might change from 
    // project to project
    .type_select {

        // the span surrounding the select
        span {
            display: inline-block;
            background-position: right center;

            //add your image here
            background-image: url( [your dropdown arrow png image] );
        }

        select {

            // make the select styling go away 
            -webkit-appearance: none;
            -moz-appearance: none;
            -ms-appearance: none;
            -o-appearance: none;
            appearance: none;

            // fix for -moz-appearance:none; not always working
            text-indent: 0.01px;
            text-overflow: "";

            // fix for ie10
            &::-ms-expand {
                    display: none;
            }

        }
    }

    .svg .type_select span {

        //add your image here
        background-image:url( [your dropdown arrow svg image] );

    }

}
Initial URL 

                                

                                                            

                                    

                                        

                                        Initial Description
                                        

                                    

                                    
SASS to customize the appearance of select inputs

                                

                                                            

                                    

                                        

                                        Initial Title
                                        

                                    

                                    
Custom Select Inputs

                                

                                                            

                                    

                                        

                                        Initial Tags
                                        

                                    

                                    
form, css

                                

                                                            

                                    

                                        

                                        Initial Language
                                        

                                    

                                    
SASS