Remove the e-input class and add required attribute to the input element.

Place the span element with class e-float-line after the input element.

Place the label element with class e-float-text after the above created span element. When you focus or filled with value in the TextBox, the label floats above the TextBox.

Creating the Floating label TextBox, you have to set the required attribute to the Input element to achieve the floating label functionality which is used for validating the value existence in TextBox. If you want to render the Floating label TextBox without
required attribute then refer to the Floating label without required attribute section.

Floating label without required attribute

You can render the Floating label TextBox without required attribute by manually
float the label above of the TextBox using input events.
You can manually float the label above of the TextBox by adding the below list of
classes to the floating label element. The classes are: