diff --git a/src/components/floor-plan/modal/basic/step/Trestle.jsx b/src/components/floor-plan/modal/basic/step/Trestle.jsx
index bd9bf705..b2d5fc78 100644
--- a/src/components/floor-plan/modal/basic/step/Trestle.jsx
+++ b/src/components/floor-plan/modal/basic/step/Trestle.jsx
@@ -671,7 +671,7 @@ const Trestle = forwardRef((props, ref) => {
               <span>{getMessage('modal.module.basic.setting.module.placement.area.eaves')}</span>
               <div className="input-grid mr10">
                 <input
-                  type="text"
+                  type="number"
                   className="input-origin block"
                   value={eavesMargin ?? 0}
                   // onChange={(e) => dispatch({ type: 'SET_TRESTLE_DETAIL', roof: { ...trestleState, eavesMargin: e.target.value } })}
@@ -684,7 +684,7 @@ const Trestle = forwardRef((props, ref) => {
               <span>{getMessage('modal.module.basic.setting.module.placement.area.ridge')}</span>
               <div className="input-grid mr10">
                 <input
-                  type="text"
+                  type="number"
                   className="input-origin block"
                   value={ridgeMargin ?? 0}
                   // onChange={(e) => dispatch({ type: 'SET_TRESTLE_DETAIL', roof: { ...trestleState, ridgeMargin: e.target.value } })}
@@ -697,7 +697,7 @@ const Trestle = forwardRef((props, ref) => {
               <span>{getMessage('modal.module.basic.setting.module.placement.area.keraba')}</span>
               <div className="input-grid mr10">
                 <input
-                  type="text"
+                  type="number"
                   className="input-origin block"
                   value={kerabaMargin ?? 0}
                   // onChange={(e) => dispatch({ type: 'SET_TRESTLE_DETAIL', roof: { ...trestleState, kerabaMargin: e.target.value } })}