2 формы HTML друг к другу

Мне нужно поставить кнопку подтверждения и кнопку отмены на странице.

Я решил создать формы с разными действиями, но две кнопки (формы) не отображаются бок о бок.

Как нам это сделать без таблицы?

Спасибо!

Ответ 1

Вы можете сделать это без поплавков, если вы установите форму и каждый элемент внутри нее для отображения в строке, тогда они будут сидеть рядом друг с другом. Причина, по которой они не бок о бок, состоит в том, что формы, как и divs и абзацы, являются элементами уровня блока, устанавливая их как встроенный в отображение, это исправит.

Пример

.button-container form,
.button-container form div {
    display: inline;
}

.button-container button {
    display: inline;
    vertical-align: middle;
}

Со следующим HTML

<div class="button-container">
    <form action="confirm.php" method="post">
        <div>
            <button type="submit">Confirm</button>
        </div>
    </form>

    <form action="cancel.php" method="post">
        <div>
            <button type="submit">Cancel</button>
        </div>
    </form>
</div>

Ответ 2

Сделайте оба "float: left". И сделайте элемент после них "clear: both";

Должен работать:)

Ответ 3

Как сказано, если вы хотите встроенные элементы, сделайте их встроенными. Это лучше:

display:inline-block;