javascript - Why same width Select and Input tag in Safari is outrageously different while rendering -

i have code setting width of <input> , <select> dynamically same (width-wise). know there ~5px width discrepancy between 2 if set width of <input> 100px set <select> width 105px; , seems work fine everywhere (chrome tends off pixel, fine me.) find out 100px width not equal 105px width in safari. in fact outrageously off. can see on following link:

http://jsfiddle.net/jh8qc/5/

check on chrome/firefox , on safari see difference.

then thought using css fix using

 -moz-box-sizing: border-box;   -webkit-box-sizing: border-box;   box-sizing: border-box; 

to maintain consistency. works not if set width dynamically seen here.

http://jsfiddle.net/jh8qc/6/

any idea?

you can width of tag running width() function that:

var foo = $("#example").width(); 

you can width of inputs , selects , then, if desired value 200 (for example), can run this:

$("#example").width(200);