Предотвращение разрыва строки <form> между двумя тегами <form>

Я хочу предотвратить разрывы строк между двумя формами, которые у меня есть.

Итак, в основном:

<form action="...">
<input type="submit" />
</form>
LINE BREAK HERE
<form action="...">
<input type="submit" />
</form>

Я хочу удалить разрыв строки. Я хочу, чтобы кнопки ввода находились в одной строке, например меню.

Ответ 1

form {
    display: inline;
}

Ответ 2

Я думаю, что это правильное решение:

form { display: inline-block; }

Значение встроенного блока используется для размещения встроенных элементов уровня блока внутри строки. Эти элементы все равно останутся блоками.

Изменение модели для элемента из блока в строку является радикальным шагом, потому что это может испортить вещи в зависимости от содержимого элемента.

Для этой конкретной проблемы использование встроенного блока - путь.

Ответ 3

Это старый поток, поэтому я, вероятно, никому не помогаю, но вот мое предложение. Многие программисты избегают таблиц и поэтому не любят мой метод, но я решу эту проблему следующим образом:

<table><tr><td><form></form></td><td><form></form></td></tr></table>

Ответ 4

Или:

form {
    float: left;
    margin-right: 5px;
}

Ответ 5

Если display: inline не работает, это может быть вызвано тем, что родительский элемент имеет слишком маленькую ширину, чтобы держать их рядом друг с другом, и это может привести к разбиению элементов формы на отдельные строки. Попробуйте добавить это правило в стиль для контейнера, который содержит две формы:

white-space: nowrap;