Probleme css html php [Résolu]

Signaler
-
 yossra -
Bonjour,

<?php
//Affichage erreurs php
error_reporting(E_ALL);
ini_set('display_errors', TRUE);
ini_set('display_startup_errors', TRUE);

// Constantes et autres variables
define('USER1','Stage');
define('PASSWORD1','Stage2020');
$message='';
$url_page2= "page2.php"; // variable à modifier selon tes besoins

// récupération propre des variables (POST/GET/SESSION...) AVANT de les utiliser
$username = !empty($_POST['username']) ? trim($_POST['username']) : NULL;
$password = !empty($_POST['password']) ? trim($_POST['password']) : NULL;

  //traitement du submit
if(isset($_POST['login'])){
  if(!$username  || !$password){
    $message='veuillez indiquer vos identifiants !';
  }elseif($username != USER1 || $password != PASSWORD1){
    $message='Vos identifiants sont faux. Merci de les vérifier';
  }elseif($username == USER1 || $password = PASSWORD1){
     // tout est ok... donc :
     header('location:'.$url_page2);
     exit; // toujours mettre un exit après une redirection
  }
}

?>
<code html>
<!DOCTYPE html>
<html>
    <head>
     <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
<style>
<code css>
* {
    box-sizing: border-box;
}
body{
    margin:0;
    height:100vh;
    width:100vw;
    overflow:hidden;
    font-family:'Lato' ,sans-serif;
    font-weight: 700;
    display: flex;
    align-items:center;
    justify-content:center;
    color:#555;
    background:#ecf0f3;

}
.login-div {
    width:430px;
    height:500px;
    padding:60px 35px 35px 35px;
    border-radius:40px;
    background:#ecf0f3;
    box-shadow:13px 13px 20px #cbced1,
                -13px -13px 20px #ffffff;
  }
  .fields {
    width:100%;
    padding:75px 5px 5px 5px;
  }
  .fields input {
    border:none;
    outline:none;
    background:none;
    font-size: 18px;
    color:#555;
    padding:20px 10px 20px 5px;
  }
  .username, .password {
    margin-bottom:30px;
    border-radius:25px;
    box-shadow: inset 8px 8px 8px #cbced1,
                inset -8px -8px 8px #ffffff;
  }
  .fields svg {
    height:22px;
    margin:0 10px -3px 25px;
  }
  .submit {
    outline:none;
    border:none;
    cursor: pointer;
    width:100%;
    height: 60px;
    border-radius:30px;
    font-size: 20px;
    font-weight: 700;
    font-family:'Lato',sans-serif;
    color:#fff;
    text-align:center;
    background:#24cfaa;
    box-shadow:3px 3px 8px #b1b1b1,
                -3px -3px 8px #ffffff;
    transition:0.5s;
  }
  .signin-button:hover {
    background:#2fdbb6;
  }
  .signin-button:active {
    background:#1da88a;
 }
</style>
  </head>
    <body>
        
        <div class="login-div">
            
            <div class="fields">
<form action="" method="post">
              <div class="username"><svg class="svg-icon" viewBox="0 0 20 20">
							<path d="M17.388,4.751H2.613c-0.213,0-0.389,0.175-0.389,0.389v9.72c0,0.216,0.175,0.389,0.389,0.389h14.775c0.214,0,0.389-0.173,0.389-0.389v-9.72C17.776,4.926,17.602,4.751,17.388,4.751 M16.448,5.53L10,11.984L3.552,5.53H16.448zM3.002,6.081l3.921,3.925l-3.921,3.925V6.081z M3.56,14.471l3.914-3.916l2.253,2.253c0.153,0.153,0.395,0.153,0.548,0l2.253-2.253l3.913,3.916H3.56z M16.999,13.931l-3.921-3.925l3.921-3.925V13.931z"></path>
						</svg><input type="username" class="user-input" placeholder="username" value="<?php echo htmlspecialchars($username);?>"/></div>
              <div class="password"><svg class="svg-icon" viewBox="0 0 20 20">
							<path d="M17.308,7.564h-1.993c0-2.929-2.385-5.314-5.314-5.314S4.686,4.635,4.686,7.564H2.693c-0.244,0-0.443,0.2-0.443,0.443v9.3c0,0.243,0.199,0.442,0.443,0.442h14.615c0.243,0,0.442-0.199,0.442-0.442v-9.3C17.75,7.764,17.551,7.564,17.308,7.564 M10,3.136c2.442,0,4.43,1.986,4.43,4.428H5.571C5.571,5.122,7.558,3.136,10,3.136 M16.865,16.864H3.136V8.45h13.729V16.864z M10,10.664c-0.854,0-1.55,0.696-1.55,1.551c0,0.699,0.467,1.292,1.107,1.485v0.95c0,0.243,0.2,0.442,0.443,0.442s0.443-0.199,0.443-0.442V13.7c0.64-0.193,1.106-0.786,1.106-1.485C11.55,11.36,10.854,10.664,10,10.664 M10,12.878c-0.366,0-0.664-0.298-0.664-0.663c0-0.366,0.298-0.665,0.664-0.665c0.365,0,0.664,0.299,0.664,0.665C10.664,12.58,10.365,12.878,10,12.878"></path>
						</svg><input type="password" class="pass-input" placeholder="password" value="<?php echo htmlspecialchars($password);?>"/></div>
            </div>
          <div class="submit">submit</div>
<?php 
      if(!empty($message)){
        echo '<div id="div_error">';
        echo '<p style="color:red;">'.$message.'</p>';
        echo '</div>';
      }
      ?>
          </div>
    </body></htm>
</code></code>

Configuration: Windows / Edge 85.0.564.51

4 réponses

j'ai un probléme dans ce code
page2:
<!DOCTYPE html>
<html>
    <head>
     <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
<style><code css>
* {
    box-sizing: border-box;
}
body{
    margin:0;
    height:100vh;
    width:100vw;
    overflow:hidden;
    font-family:'Lato' ,sans-serif;
    font-weight: 700;
    display: flex;
    align-items:center;
    justify-content:center;
    color:#555;
    background:#ecf0f3;

}
.login-div {
    width:430px;
    height:700px;
    padding:60px 35px 35px 35px;
    border-radius:40px;
    background:#ecf0f3;
    box-shadow:13px 13px 20px #cbced1,
                -13px -13px 20px #ffffff;
  }
  .fields {
    width:100%;
    padding:75px 5px 5px 5px;
  }
  .fields input {
    border:none;
    outline:none;
    background:none;
    font-size: 18px;
    color:#555;
    padding:20px 10px 20px 5px;
  }
  .username {
    margin-bottom:30px;
    border-radius:25px;
    box-shadow: inset 8px 8px 8px #cbced1,
                inset -8px -8px 8px #ffffff;
  }
  .fields svg {
    height:22px;
    margin:0 10px -3px 25px;
  }
  .signin-button {
    outline:none;
    border:none;
    cursor: pointer;
    width:100%;
    height: 60px;
    border-radius:30px;
    font-size: 20px;
    font-weight: 700;
    font-family:'Lato',sans-serif;
    color:#fff;
    text-align:center;
    background:#24cfaa;
    box-shadow:3px 3px 8px #b1b1b1,
                -3px -3px 8px #ffffff;
    transition:0.5s;
  }
  .signin-button:hover {
    background:#2fdbb6;
  }
  .signin-button:active {
    background:#1da88a;
 }
</style>
  </head>
    <body>
        
        <div class="login-div">
            
            <div class="fields">
              <div class="username"><svg class="svg-icon" viewBox="0 0 20 20">
							<path d="M17.388,4.751H2.613c-0.213,0-0.389,0.175-0.389,0.389v9.72c0,0.216,0.175,0.389,0.389,0.389h14.775c0.214,0,0.389-0.173,0.389-0.389v-9.72C17.776,4.926,17.602,4.751,17.388,4.751 M16.448,5.53L10,11.984L3.552,5.53H16.448zM3.002,6.081l3.921,3.925l-3.921,3.925V6.081z M3.56,14.471l3.914-3.916l2.253,2.253c0.153,0.153,0.395,0.153,0.548,0l2.253-2.253l3.913,3.916H3.56z M16.999,13.931l-3.921-3.925l3.921-3.925V13.931z"></path>
						</svg><input type="username" class="user-input" placeholder="username" /></div>
           
            </div>
            <button class="signin-button">Login</button>

          </div>
    </body></html>
</code>
Messages postés
3671
Date d'inscription
jeudi 16 juin 2005
Statut
Membre
Dernière intervention
11 février 2021
982
Bonjour,

Il faudrait que tu nous dises quel est ton problème dans ce code, on ne peut pas le deviner...
Donc, pour qu'on puisse t'aider :
- Qu'est-ce que tu voudrais comme résultat ?
- Qu'est-ce que tu obtiens, et qui ne te convient pas ?
- Quels sont les messages d'erreurs, s'il y en a ?

Xavier
merci j'ai résolu le probléme