p {
            margin:20px 0;
            position:relative;
            width: 100%
          }

        label {
            padding:10px;
            pointer-events: none;
            position:absolute;
            left:0;
            top:0;
            transition: 0.2s;
            transition-timing-function: ease;
            transition-timing-function: cubic-bezier(0.25, 0.1, 0.25, 1);
            opacity:0.5;
            background: #fff;
        }

        input {
            padding:10px;
        }

        input:focus + label, input:not(:placeholder-shown) + label {
            opacity:1;
            transform: scale(0.75) translateY(-70%) translateX(-14px);
        }



<p>
    <input placeholder=" ">
    <label>Your First Name</label>
</p>

<p>
    <input placeholder=" ">
    <label>Your Last Name</label>
</p>