css - 在同一行获取链接按钮

Question

我觉得这应该很容易搜索到，但我找不到。

我想要水平相邻的链接按钮:

<form action="http://google.com">
    <input class="button" type="submit" value="google">
    <input class="button" type="submit" value="yahoo">
</form>

这有效，除了它们都链接到 yahoo。我需要每个按钮以不同方式链接。

<form action="http://google.com">
    <input class="button" type="submit" value="google">
</form>
<form action="http://yahoo.com">
    <input class="button" type="submit" value="yahoo">
</form>

这链接到不同的 url，但是它在另一个之上呈现一个。

如何让它们在同一行？

Answer 1

你可以通过设置 display: inline-block; 来实现。

form {
    display: inline-block;
}

<form action="http://google.com">
    <input class="button" type="submit" value="google">
</form>
<form action="http://yahoo.com">
    <input class="button" type="submit" value="yahoo">
</form>