Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- <form action="#" method="post">
- <div class="input_block">
- <input type="text" name="name" id="name_input">
- <label for="name_input">
- <span>Full Name:</span>
- </label>
- </div>
- <div class="input_block">
- <input type="text" name="phone" id="phone_input">
- <label for="phone_input">
- <span>Phone Number:</span>
- </label>
- </div>
- </form>
- .input_block {
- margin: 0 0 25px 0;
- width: 344px;
- height: 66px;
- position: relative;
- }
- .input_block input {
- display: block;
- padding: 0;
- width: 344px;
- height: 64px;
- border: none;
- border-bottom: 2px solid #000;
- background: none;
- font-family: "ProximaNovaBold";
- font-size: 24px;
- color: #000;
- outline: none;
- }
- .input_block label {
- display: block;
- width: 344px;
- height: 64px;
- position: absolute;
- top: 0;
- left: 0;
- }
- .input_block label span {
- display: block;
- height: 24px;
- -webkit-transition: all 0.3s ease;
- -moz-transition: all 0.3s ease;
- -o-transition: all 0.3s ease;
- -ms-transition: all 0.3s ease;
- transition: all 0.3s ease;
- font-family: "ProximaNovaBold";
- font-size: 24px;
- line-height: 24px;
- color: #000;
- position: absolute;
- top: 21px;
- left: 0;
- }
- .input_block input:focus + label span {
- font-size: 14px;
- top: -10px;
- }
Add Comment
Please, Sign In to add comment