1

Made the following code for the input field and its label:

<input id="username" class=uk-input" type="text">
<label for="username">Enter your username</label>

Is it possible to make input field's label floating like on the illustration by using just UIKit's techniques?

enter image description here

I've searched through UIKit documentation but found nothing related to my question.

If it is impossible with the UIKit then what is the best practice?

YKKY
  • 605
  • 1
  • 6
  • 18

1 Answers1

0

The UIKit class uk-form-label can be used here:

<form class="uk-form-stacked">
    <div class="uk-margin">
        <label class="uk-form-label" for="username">Enter your username</label>
        <div class="uk-form-controls">
            <input class="uk-input" id="username" type="text" placeholder="...">
        </div>
    </div>
</form>

More information here: https://getuikit.com/docs/form#layout

mostsignificant
  • 312
  • 1
  • 8