react-numeric-input icon indicating copy to clipboard operation
react-numeric-input copied to clipboard

input wide on firefox seems too big ( and does not match that shown on chrome )

Open omerbrandis opened this issue 1 month ago • 0 comments

hello

it looks like the display on Chrome and Firefox do not match. chrome seems ok,
the width property for the input element is 63.9931px; with some about 1 char of space on the left and right of the displayed digits. while on firefox, its 129px. with too much space on the left and right of the digits.

both browsers confirm fontsize of 25px. they don't use the same font. but as explained it does not look like a font related issue to me.

here's the code

<NumericInput min={30} max={100} size={3} value={...} onChange={...}  
 	style={{        paddingLeft:"0 !important;",
			btnUp: {display:"none"},
			btnDown: {display:"none"},
 			input: { color: 'white',fontSize:"25px",backgroundColor:"black",paddingRight:"0",paddingLeft:"0 !important;",textAlign:"center"}, 
                        'input:not(.form-control)': {border:"none",borderRadius:"15px"},
                        
              }}
      />

can anyone suggest a solution , or a method to debug the cause for this issue? :-)

omerbrandis avatar Jul 04 '24 09:07 omerbrandis