css - add webfont icon using content on :before in a custom html selectbox -
i'm trying make custom styled selectbox base on default html selectbox , i'm trying change default dropdown icon on default html selectbox using :before , put "content: '\27'" ("/27" ionic icon of dropdown icon) sadly not working, help, suggestion, recommendation, ideas , clues appreciated. thank you!
/* select box */ .dodong_ui_selectbox{ border: 1px solid #ccc; -webkit-appearance: none; padding: 5px; } .dodong_ui_selectbox:before{ content: '\27'; } .dodong_ui_selectbox:active, .dodong_ui_selectbox:focus{ outline: none; }
<link href="http://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css" rel="stylesheet"/> <select name="user" class="dodong_ui_selectbox"> <option value="user1">jason acappela</option> <option value="user2">mark henry</option> <option value="user3">xoe jii</option> <option value="user4">abdul abubakar muhammad</option> <option value="user5">juan de la cruz</option> </select>
default dropdown displayed differently on different browsers , platforms believe better use customised dropdown http://tympanus.net/tutorials/customdropdownliststyling/ rather trying stylise it. don't think can add content using pseudo element on dropdown.
Comments
Post a Comment