Question

我正在尝试让表单按钮连续显示内联。我正在使用CSS来设置来自别人脚本的HTML输出，所以我必须理解HTML中的结构。我不能把它改成我理解的东西。请参阅下面的代码。

以这种方式使用时，这些元素的默认样式是什么？我的印象是块元素并且是内联的。无论我如何尝试使用CSS来设置这个样式，我都无法改变它们的位置（除了浮点数，我想在这种情况下避免使用它）。救命！谢谢:)

 <html>
 <head></head>
 <body> 

 <div class="comment_buttons">
    <form class="button discussion__edit" method="get" action="/doku.php#discussion__comment_form">
      <div class="no">
        <input type="hidden" name="id" value="start" />
        <input type="hidden" name="do" value="show" />
        <input type="hidden" name="comment" value="edit" />
        <input type="hidden" name="cid" value="f871dd5933621b4fe9070bab542ff3ea" />
        <input type="submit" value="Edit" class="button" title="Edit" />
      </div>
    </form>
            <form class="button discussion__toogle" method="get" action="/doku.php">
      <div class="no">
        <input type="hidden" name="id" value="start" />
        <input type="hidden" name="do" value="show" />
        <input type="hidden" name="comment" value="toogle" />
        <input type="hidden" name="cid" value="f871dd5933621b4fe9070bab542ff3ea" />
        <input type="submit" value="Hide" class="button" title="Hide" />
      </div>
    </form>
            <form class="button discussion__delete" method="get" action="/doku.php">
      <div class="no">
        <input type="hidden" name="id" value="start" />
        <input type="hidden" name="do" value="show" />
        <input type="hidden" name="comment" value="delete" />
        <input type="hidden" name="cid" value="f871dd5933621b4fe9070bab542ff3ea" />
        <input type="submit" value="Delete" class="button" title="Delete" />
      </div>
    </form>
          </div>
</body>
</html>

Answer 1

表单元素是内联的，但表单中的表单和div是块元素。

所以将它们改为内联：

form, form div { display: inline; }

http://jsfiddle.net/fbCgk/

为什么这些HTML表单按钮不会显示为内联？

1 个答案: