Untitled

<!DOCTYPE html>
<html lang="pl">

<head>
   <meta charset="UTF-8">
   <meta http-equiv="X-UA-Compatible" content="IE=edge">
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
   <title>Strona</title>
   <link rel="stylesheet" href="style.css">
</head>

<body>
   <div class="glowny">
      <div class="lewy">
         <img src="obraz.jpg" alt="komputer">
      </div>
      <div class="prawy">
         <div class="sign">
            <h1>Sign up</h1>
         </div>
         <div class="napis">
            <p class="napisek">Welcome to logistics supply chain platform.</p>
            <p class="napisek2">Register as a member to experience.</p>
         </div>
         <div class="email">
            <label>E-mail</label>
         </div>
         <input type="email" name="email1" id="email1">
         <div class="haslo">
            <label>Password</label>
         </div>
         <input type="password" name="password1" id="password1">
         <input type="checkbox" name="checkbox1" id="checkbox1">
         <label class="agree">I agree to the terms of service</label>
         <br>
         <input type="button" value="Create Account" name="button1" id="button1">
         <label class="member">Already a member?</label>
         <label class="in">Sign in</label>
      </div>
   </div>
</body>

</html>

img {
   height: 100%;
   width: 100%;
}

.glowny {
   display: flex;
}

.sign {
   position: relative;
   top: 100px;
   left: 60px;
}

h1 {
   font-weight: 100;
   margin: 0px;
}

.prawy {
   display: flex;
   flex-direction: column;
   width: 30%;
}

p {
   margin-top: 0px;
   margin-bottom: 4px;
   color: grey;
}

.napis {
   position: relative;
   top: 125px;
   left: 60px;
}

label {
   color: grey;
}

.email,
.haslo {
   position: relative;
   left: 60px;
   top: 190px;
}

#email1 {
   position: relative;
   left: 60px;
   top: 200px;
   width: 400px;
   height: 50px;
   border: none;
   background-color: rgb(247, 247, 247);
}

.haslo {
   position: relative;
   top: 220px;
}

#password1 {
   position: relative;
   left: 60px;
   top: 230px;
   height: 50px;
   width: 400px;
   border: none;
   background-color: rgb(247, 247, 247);
}

#checkbox1 {
   position: relative;
   left: -155px;
   top: 260px;
}

.agree {
   position: relative;
   left: 85px;
   top: 241px;
}

#button1 {
   position: relative;
   top: 265px;
   left: 60px;
   width: 400px;
   height: 50px;
   text-align: center;
   background-color: rgb(70, 178, 255);
   color: white;
   border: none;
}

.member {
   position: relative;
   top: 350px;
   left: 60px;
}

.in {
   position: relative;
   top: 333px;
   left: 215px;
   color: blue;
}
Editor is loading...