Intro Component With Sign Up Form

Community feedback

• 

  P

  Koda👹•3,830

  @kodan96Posted 7 months ago

  hi there! 🙌

  <div class="wrapper">
      <input type="text" required class="data-field" name="" id="field-name" placeholder="First Name">
      <img id="error-icon1" src="images\icon-error.svg" class="error-icon" alt="error icon">
      <p id="error-msg1" class="error-msgs">First name cannot be empty</p>
  </div>
  

  Create a section like this for all the input fields in the form, then apply

  .wrapper {
  position: relative;
  }
  
  .error-icon {
  position: absolute;
  right: 2rem; 
  transform: translateY(-50%)
  }
  

  You might need to play around with the transform or give right a negative value, but this should position it. 📐

  Hope this was helpful 🙏

  Good luck and happy coding! 💪

  0