diff --git a/ui/src/components/BeamlineAttribute/BeamlineAttribute.module.css b/ui/src/components/BeamlineAttribute/BeamlineAttribute.module.css
index a2de248f8..4a1156452 100644
--- a/ui/src/components/BeamlineAttribute/BeamlineAttribute.module.css
+++ b/ui/src/components/BeamlineAttribute/BeamlineAttribute.module.css
@@ -21,6 +21,7 @@
 }
 
 .input {
+  width: 9em;
   height: 36px;
   appearance: auto !important;
 }
diff --git a/ui/src/components/BeamlineAttribute/BeamlineAttributeForm.jsx b/ui/src/components/BeamlineAttribute/BeamlineAttributeForm.jsx
index a39552685..d3b18236a 100644
--- a/ui/src/components/BeamlineAttribute/BeamlineAttributeForm.jsx
+++ b/ui/src/components/BeamlineAttribute/BeamlineAttributeForm.jsx
@@ -41,7 +41,6 @@ function BeamlineAttributeForm(props) {
         name="value"
         aria-label="Value"
         step={step}
-        size={10}
         defaultValue={value.toFixed(precision)}
         disabled={isBusy}
       />
diff --git a/ui/src/components/MotorInput/MotorInput.jsx b/ui/src/components/MotorInput/MotorInput.jsx
index 5564af2cb..d7893f853 100644
--- a/ui/src/components/MotorInput/MotorInput.jsx
+++ b/ui/src/components/MotorInput/MotorInput.jsx
@@ -144,7 +144,6 @@ export default class MotorInput extends React.Component {
                 <input
                   className={styles.stepInput}
                   type="number"
-                  size={3}
                   defaultValue={step}
                   disabled={this.props.disabled}
                   onChange={(evt) =>
diff --git a/ui/src/components/MotorInput/MotorInput.module.css b/ui/src/components/MotorInput/MotorInput.module.css
index fbda6263f..55a364707 100644
--- a/ui/src/components/MotorInput/MotorInput.module.css
+++ b/ui/src/components/MotorInput/MotorInput.module.css
@@ -1,4 +1,5 @@
 .stepInput {
+  width: 3em;
   background-color: #f5f5f5;
   border: 1px solid #ccc;
   font-size: 12px;