检查HTML表单表明按钮不是表单的一部分

kumar 发表于 Dev

库玛

以下是HTML内容<body>标签

<div class="container mt-5 pt-2 pb-4" id="container-primary">
<div class="container mt-3" id="container-secondary"><h3>Welcome</h3><br> Please Enter your <strong>Password</strong> to view the question</br>
</div>
<div class="container pt-2" id="container-tertiary">
  <form method="post" id="pwd-form" autocomplete="off">
      <input type="password" class="form-control mx-auto" id="pwd" placeholder="Password" name="pwd" spellcheck="false"></input>
    <div class="container" id="pwd-error-container"><?php
    session_start();
    if (isset($_SESSION['wrongpwd'])){
      echo $_SESSION['wrongpwd'];
      unset($_SESSION['wrongpwd']);
    } ?>
    </div>
    <div class="container mx-auto" id="button-container">
      <input type="submit" class="btn btn-info float-left" id="forgotpwd" value="Forgot Password">
      <input type="button" class="btn btn-info float-right" id="submit-button" value="Validate" disabled>
    </div>
 </form>

中有两个按钮<form>。但是，当我inspect在浏览器中浏览网页时，我发现这两个按钮不在内<form>。到底是什么引起了问题？

以下是css：

  #container-primary{
    background-color: ;
  }
  #container-secondary{
    background-color: ;
    text-align: center;
  }
  #container-tertiary{
    background-color: ;
    text-align: center;
    margin-top: 30px;
  }
  #pwd-form{
    background-color: green;
  }
  #pwd{
    width: 40%;
    min-width: 300px;
    font-size: 18px;
    padding-top: 1px;
    padding-bottom: 1px;

  }
  #pwd-error-container{
    background-color: ;
    font-size: 19px;
    color: rgb(217, 48, 37);
    font-weight: bold;
  }
  #button-container{
    margin-top: 25px;
    width: 40%;
    min-width: 300px;
    margin-bottom: 25px;
  }
  #question-form{
    opacity: 0.3;
  }
  #answer{
    width: 40%;
    min-width: 300px;
    font-size: 18px;
    padding-top: 1px;
    padding-bottom: 1px;
    margin-top: 5%;
  }
  </style>```


I don't know where I have gone wrong. Screenshots of the inspection have been given in the comments section.

詹妮莎·拉桑加（Janitha Rasanga）

删除你的浮左和浮动权从button.Then类它做工精细。

<div class="container" id="button-container">
  <div class="row">
    <div class="mr-auto">
      <button type="submit" class="btn btn-info" id="forgotpwd">Forgot Password</button>
    </div>
    <div class="">
      <button type="button" class="btn btn-info" id="submit-button" disabled>Validate</button>
    </div>
  </div>
</div>

https://jsfiddle.net/Lebxp70k/44/

本文收集自互联网，转载请注明来源。

如有侵权，请联系 [email protected] 删除。