fix(input): fix display of ion-input in narrow ion-item in Firefox (#16978)

* fix(input): fix display of ion-input in narrow ion-item in Firefox

* Update index.html

test(input): add narrow input test

Author: pwespi

core/src/components/input/input.scss

@@ -67,6 +67,7 @@
   flex: 1;
 
   width: 100%;
+  max-width: 100%;
   height: 100%;
 
   border: 0;

core/src/components/input/test/basic/index.html

@@ -118,6 +118,16 @@
         <ion-input clear-input value="reallylonglonglonginputtoseetheedgesreallylonglonglonginputtoseetheedges"></ion-input>
       </ion-item>
 
+      <ion-item style="max-width: 250px">
+        <ion-input value="Narrow input"></ion-input>
+        <ion-label text-right>Left</ion-label>
+      </ion-item>
+
+      <ion-item style="max-width: 250px">
+        <ion-label>Right</ion-label>
+        <ion-input text-right value="Narrow input"></ion-input>
+      </ion-item>
+
     </ion-content>
 
     <script>