dimanche 8 novembre 2020

how to align my "remember me" check box to the center?

I tried to align my checkbox and label to the center of the screen but it wasn't moving at all. i tried to put it in the container tag but it result in the label of the check box is not align together. can someone please help with this problem?

.container {
  width: 350px;
  clear: both;
}

.container input {
  width: 100%;
  clear: both;
}
<!DOCTYPE html>
<html lang= "en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv= "X-UA-Compatible" content = "IE=edge">
    <meta name= "viewport" content = "width=device-width,initial-scale=1, shrink-to-fit=no">
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css">
    <link rel="stylesheet" type="text/css" href="login.css">
</head>
<body>

<div class="container">
<form action="<?= $_SERVER ['PHP_SELF'] ?>" method="post" class="p-4">
<div class= "form-group"></div>
<input type="text" name="phone" class="form-control form-control-lg" placeholder="Phone" required>

<div class= "form-group"></div>
<input type="password" name="password" class="form-control form-control-lg" placeholder="Password" required>
</div>

<form>  
<label>
<input type="checkbox" checked>
Remember me 
</label>
</form>






<div class="container">     
<p>
<div class="form-group">
<input type ="submit" name="login"
class="btn btn-block" >
</p>
</div>

</body>



    



            
</html>



Aucun commentaire:

Enregistrer un commentaire