在 w3css 上并排显示表单和按钮

Question

我在我的 codeiniter 项目中使用 w3.css，我想将它们并排放置。

这是我的代码：

<a type="button" class="w3-btn w3-blue w3-pull-left" href="http://localhost/cblog/posts/ikkinchi-post">Tahrirlash</a> 
<form action="http://localhost/cblog/posts/delete/2" method="post" accept-charset="utf-8">
    <input type="submit" value="O`chirish" class="w3-btn w3-red">
</formm>

Answer 1

为什么你的 link 上有 type="button" 属性？

要在一行中显示元素，请将其样式更改为：

display: inline-block;

或者如果你不需要填充

display:inline;

所以它看起来像这样

a,form{
    display:inline-block;
}

Answer 2

您可以查看 W3.css 的 documentation，看看是否有 class 可以使元素显示为内联，也许可以使用 classes专为导航栏设计。如果没有，那么您可以自己创建一个 class 并将其分配给您想要的元素。

.displayInline { display: inline;}

在 w3css 上并排显示表单和按钮

Displaying form and button next to each other on w3css

html

css

forms

button

w3.css