Нет разрыва строки между кнопкой и формой

Как получить кнопку и элемент формы в одной строке без разрыва строки? большое спасибо!

  <button>ask question</button>
<form action="/search" method="get">
    <input type="text" name="q" value="{SearchQuery}"/>
    <input type="submit" value="Search"/>
    </form>

Ответы

Ответ 1

Используйте этот стиль CSS: style="display: inline;" в вашей форме.

<form action="/search" method="get" style="display: inline;">

Здесь представлена ​​демонстрация на JSBin.

Ответ 2

оба <button> и <form> являются элементами уровня блока. вам нужно сделать их встроенными с CSS display: inline. не уверен, что это значит. также это зависит от вашего более широкого HTML.

Ответ 3

Поля ввода - это элементы уровня блока. Вы можете изменить правила отображения в CSS:

input { display: inline; }

Ответ 4

Вы можете сделать кнопку float:

<button style="float: left;">ask question</button>

Ответ 5

Вы можете плавать: слева и кнопка и форма