<!DOCTYPE html>
<html lang="en">
<head>
<link rel="stylesheet" href="./css/createanaccount.css">
<script src="https://kit.fontawesome.com/c90e5c3147.js" crossorigin="anonymous"></script>
</head>
<body>
<div class="container">
<div class="header">
<h2>Create An Account</h2>
</div>
<form class="form" id="form">
... (Your content goes here) ...
</form>
</div>
<script src="js/createanaccount.js"></script>
</body>
</html>
@import url('https://fonts.googleapis.com/css2?family=Poppins&display=swap');
*{
box-sizing: border-box;
}
body{
background-color: #9b59b6;
font-family: "Poppins", sans-serif;
display: flex;
align-items: center;
justify-content: center;
min-height: 100vh;
margin: 0;
}
span{
font-size: 0.8rem;
}
.container{
background-color: #fff;
border-radius: 5px;
box-shadow: 0 2px 5px rgba(0, 0, 0, 0.3);
overflow: hidden;
width: 400px;
max-width: 100%;
}
... (Remaining CSS styles go here) ...
// JavaScript code goes here
I am currently working on developing a form validation script for an ongoing project. However, the error messages are not displaying as expected and seem to be behaving unpredictably. Requesting assistance in troubleshooting this issue would be highly appreciated.
Here is an image showcasing the unexpected behavior of the error messages for reference