How would you render such an input?

Question

css

Hello.
Actually to the question:
i.imgur.com/04eVghQ.jpg?1
How am I going to do it:

<fieldset>
  <legend>Email Address (Case Sensitive)</legend>
  <input type="text">
</fieldset>
...

And CSS styles for it all.
But maybe there are some more adequate solutions?

Answer 1

https://jsfiddle.net/ghp4gscq/3/
it seemed to me that this would be a more adequate solution. I must say right away that this is only the initial template. Then do it yourself.
Of course, I would also make an outer container for the form with text, instead of a div with the label class, I would make a label tag, change the color of the active / inactive label, and many more small optimizations. But he showed me where to start.

Answer 2

codepen.io/tarthur/pen/yONYJa