diff --git a/index.html b/index.html
index 141aa45..77c7aa8 100644
--- a/index.html
+++ b/index.html
@@ -26,6 +26,10 @@ <h1 id="todoTitle">ToDo App</h1>
             </svg>
         </div>
         
+        <div class="task-length-error" style="display: none;">
+            <p>Needs at least 5 characters</p>
+        </div>
+        
         <div class="filter-tasks">
             <select id="filter-list" title="Filter Tasks">
                 <optgroup label="Filter Tasks">
diff --git a/script.js b/script.js
index c81e60c..d530344 100644
--- a/script.js
+++ b/script.js
@@ -2,6 +2,7 @@ const taskInput = document.querySelector("#taskInput");
 const taskAddBtn = document.querySelector("#addSvg");
 const taskContainer = document.querySelector(".task-container");
 const taskField = document.querySelector(".task");
+const inValidTaskLength = document.querySelector(".task-length-error");
 const taskCountText = document.querySelector("#clearAllTaskText");
 const filterSelected = document.querySelector("#filter-list");
 const clearAllTaskBtn = document.querySelector("#clearAllTaskBtn");
@@ -41,17 +42,28 @@ const editTaskText = (task) => {
     
     // make the task text editable 
     const editTaskText = task.querySelector(".taskText");
+    const previousTaskText = editTaskText.textContent;
     editTaskText.setAttribute("contenteditable", "true");
     editTaskText.focus();
 
     // Listen for the blur event to detect when the user is done editing 
-    editTaskText.addEventListener("blur", () => {
+    editTaskText.addEventListener("blur", (e) => {
+
         // Make the task text uneditable 
         editTaskText.setAttribute("contenteditable", "false");
 
-        // update task text into local storage 
+        // remove unwanted spaces 
+        editTaskText.textContent = editTaskText.textContent.trim();
+
+        // if the newTaskText is less than 5 characters, then update to prevoius task text 
+        if(editTaskText.textContent === '' || editTaskText.textContent.length < 5)
+        {
+            editTaskText.textContent = previousTaskText;
+        }
+
+        // update task text in storage 
         updateTaskTextInStorage(task);
-  });
+    });
 }
 
 // delete the task when clicked on deleteIcon 
@@ -70,8 +82,13 @@ const deleteTask = (task) => {
 
 // add new task to the list when clicked on plusIcon or pressed Enter key 
 const addNewTask = () => {
-    // get input field value 
-    const newTask = taskInput.value;
+
+    // reset the error message 
+    inValidTaskLength.style.display = "none";
+    taskInput.style.border = "1.5px solid gray";
+
+    // get input field value and remove unwanted spaces 
+    const newTask = taskInput.value.trim();
 
     if (newTask !== '' && newTask.length >= 5) {
         // cloning the structure of tasks 
@@ -93,7 +110,10 @@ const addNewTask = () => {
         addNewTaskToLocalStorage(newTaskField);
     }
     else
-        alert("Task must be of at least 5 characters to be registered.");
+    {
+        inValidTaskLength.style.display = "block";
+        taskInput.style.border = "1.5px solid red";
+    }
 
     // focus the input box for typing 
     taskInput.focus();
diff --git a/style.css b/style.css
index 1b7f84a..2edba34 100644
--- a/style.css
+++ b/style.css
@@ -33,7 +33,6 @@ body {
     justify-content: space-between;
     align-items: center;
     padding: 4px;
-    margin-bottom: 6px;
 }
 #taskInput {
     width: 85%;
@@ -59,6 +58,12 @@ body {
     border-radius: 4px;
     cursor: pointer;
 }
+/* Task length error */
+.task-length-error {
+    color: red;
+    margin-left: 8px;
+    margin-bottom: 12px;
+}
 /* Filter Tasks */
 .filter-tasks {
     padding: 4px 8px;