jquery - Adding items to select does not work in Chrome -


i have following code works fine in ie8. jquery code add items multi-select list. in chrome , safari not working - items not visible

note: though works in firefox, aligning right. , when select option item, gets hidden.

how can make working in 4 browsers?

jsfiddle: http://jsfiddle.net/lijo/upr8k/

code

<script src="http://ajax.aspnetcdn.com/ajax/jquery/jquery-1.9.0.min.js"></script> <script type="text/javascript">     $(document).ready(function () {     $(function () {         $("#btncostpagenumbermagnifinglens").click(function () {              $("#mtxtcostpagedescription").append('<option value=1>my option</option>');          });     });     }); </script>  <style type="text/css">      .floaterleft     {         width:300px;         height:300px;         background-color:gray;         padding:10px 10px 10px 10px;      }  </style>  <body>     <div class="floaterleft">         <div class="headertextbox">             <input id="txtcostpagenumber" id="costpagenumber" name="costpagenumber" style="width: 240px; padding-right: 15px" type="text" value="" />         </div>         <div class="magenifyingbtn, headermagnifybutton">             <input type="button" name="btncostpagenumbermagnifinglens" id="btncostpagenumbermagnifinglens" class="magenifyingbtn">         </div>          <select id="mtxtcostpagedescription" name="mtxtcostpagedescription" multiple="multiple" style="width: 290px; padding: 10px 152px 0px 154px; float: right"></select>     </div> </body> 

problem @ select style

padding: 10px 152px 0px 154px;  

this hides options

demo padding removed style on element


Comments

Popular posts from this blog

How to remove text and logo OR add Overflow on Android ActionBar using AppCompat on API 8? -

html - How to style widget with post count different than without post count -

url rewriting - How to redirect a http POST with urlrewritefilter -