Click here to Skip to main content
15,886,362 members
Please Sign up or sign in to vote.
1.00/5 (1 vote)
See more:
Im trying to create a project where the user has to input a username and password. Its a super simple page where the only things there are an image for the background and two input boxes for a username and password, along with the log in button.
I appreciate any help!

What I have tried:


This is what I have for the text boxes which work, I just need to know how to position them how I'd like... and over the top of any image

<form action="action_page.php">

  <pre><div class="container">
    <label for="uname">Username</label>
    <input type="text" placeholder="Enter Username" name="uname" required>

    <label for="psw">Password</label>
    <input type="password" placeholder="Enter Password" name="psw" required>

    <button type="submit">Login</button>
   
  </div>


</form>


This is the image I want as the background, and code to make it fit the browser window
<style>
* {
 margin: 0;
 padding: 0;
}
.imgbox {
 display: grid;
 height: 100%;
}
.center-fit {
 max-width: 100%;
 max-height: 100vh;
 margin: auto;
}

<div class="imgbox">

</div>
Posted

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)



CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900