HTML 5 <form> 很奇怪答案

【问题标题】：HTML 5 <form> being weirdHTML 5 <form> 很奇怪
【发布时间】：2016-01-06 00:28:22
【问题描述】：

所以我目前正在通过表单构建一组 3 个按钮，并且使用以下代码遇到了一个我以前从未见过的奇怪问题：

<div class='logout'>
  <form action='action.php' method='post'>
    <input type='submit' value='H'>
    <input type='text' name='mode' value='0' hidden>
  </form>
</div>
<div class='Mini'>
  <form action='action.php' method='post'>
    <input type='submit' value='M'>
    <input type='text' name='mode' value='MINI' hidden>
  </form>
</div>
<div class='Close'>
   <form action='action.php' method='post'>
     <input type='submit' value='C'>
     <input type='text' name='mode' value='DISPLAY' hidden>
  </form>
</div>

在当前状态下，没有显示任何表单，但是当从关闭表单标签中删除 > 时，它们会完全发挥作用

CSS如下

.logout{
    position:Absolute;
    left:90%;
    top:0%;
}
.Mini{
    position:Absolute;
    left:87%;
    top:0%;
    z-index: 1;
}
.Close{
    position:Absolute;
    left:-130%;
    top:0%;
    z-index: 1;
}

【问题讨论】：

它们是否打算在<div>s 上用（例如）CSS 隐藏？可能是删除 > 导致 HTML 被错误地解析，并且类/样式未被应用。不过，这只是一种可能性，您的问题中没有足够的信息来提供正确的诊断。
目前正在检查 CSS 文件是否存在问题

标签： html forms web

【解决方案1】：

您的代码运行良好。可能有一些css 或div 覆盖您的form 并使其变为display:none 或hidden。如果您删除>，它将破坏一些css 和html。这样您就可以看到所有表格。

这是运行它并检查的代码：

<div class='logout'>
  <form action='action.php' method='post'>
    <input type='submit' value='H'>
    <input type='text' name='mode' value='0' hidden>
  </form>
</div>
<div class='Mini'>
  <form action='action.php' method='post'>
    <input type='submit' value='M'>
    <input type='text' name='mode' value='MINI' hidden>
  </form>
</div>
<div class='Close'>
   <form action='action.php' method='post'>
     <input type='submit' value='C'>
     <input type='text' name='mode' value='DISPLAY' hidden>
  </form>
</div>

【讨论】：

原来是因为它在最后一天左右工作，CSS 是围绕
标记被破坏的，必须为它重新调整 CSS
是的，我检查了你的css，你错了left align，你可以使用float:left;

【解决方案2】：

正如你在这里看到的 --> FIDDLE

你的元素出现了。我假设它是CSS ...您的 HTML 本身没有任何问题。您需要查看您的 CSS 样式并找出为什么没有显示。很可能是div -->

<div class='logout'>

那是你的问题。

【讨论】：