Как выровнять две кнопки отправки на одной строке

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

HTML является

<td> 
<div> 
Involved: 
<form> 
<input type="submit" value="Add from list"> 
</form> 
<p>or</p>  
<form> 
<input type="submit" value="Type a name"> 
</form> 
</div> 
</td>

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

, кажется, как «участие (введите название) или (добавить из списка)»,

может я знаю, как это сделать.

Спасибо,

источник

2013-04-13 user2086641

Число '

' tags is not equal to the number of '

', поэтому ваш html недействителен. – Arjan

У вас есть беспорядок с HTML, нет необходимости в том, что много элементов

<td> 
    <form>Involved: <input type="submit" value="Add from list"> or <input type="submit" value="Type a name"></form> 
</td>

источник

2013-04-13 10:47:14 monkeyinsight

Вы можете использовать <div> и не таблицы. Дайте кнопкам значение CSS display:inline-block;

источник

2013-04-13 10:50:03 Vector

Во-первых, код недействителен из-за окончания блока div в середине.

Тогда форма является блочным элементом.

Итак, что вы можете сделать, это сделать его встроенным элементом с приличием. «display: inline-block». То же самое для вас, это необязательно, если вы хотите добавить его в любом случае, так как это также элемент блока, обязательно примените этот стиль и сделайте его встроенным.

<div> 
Involved: 
    <form style="display:inline-block"> 
    <input type="submit" value="Add from list"> 
    </form> or  
    <form style="display:inline-block"> 
    <input type="submit" value="Type a name"> 
    </form> 
</div>

Более подробную информацию о inline vs block elements here

источник

2013-04-13 10:50:14 Ezix

<!DOCTYPE html> 
<html> 
<head> 
<style> 
form {display: inline-block;} 
</style> 
</head> 
<body> 

<table> 
<tr> 
<td> 
<form> 
    <label>Involved:</label> 
    <input type="submit" value="Add from list"> 
</form> 
<form> 
    <label>or</label> 
    <input type="submit" value="Type a name"> 
</form> 
</td> 
</tr> 
</table> 

</body> 
</html>

источник

2013-04-13 10:54:58

попробовать этот CSS

div#frm *{display:inline}

и HTML

<div id="frm"> 
Involved: 
<form> 
<input type="submit" value="Add from list"> 
</form> 
<p>or</p>  
<form> 
<input type="submit" value="Type a name"> 
</form> 
</div>

источник

2013-04-13 10:58:51 Sunny

вот jsFiddle http://jsfiddle.net/3dA3y/1/ – Sunny

Работал и для меня. Кстати, какое значение имеет '*'? Я заметил, что он обрушится без него. – kaizenCoder

@aspiringCodingArtisan * - это дикий символ, он выберет каждый дочерний тег формы – Sunny

<div style="display: inline;" align="center"> 
     <div style="float: left;"> 
      <button style="color: white; padding: 15px 32px; text-align: center; text-decoration: none; border-radius: 4px; display: inline-block; font-size: 100%;">Hello</button> 
     </div> 
     <div style="float: right;"> 
      <button style="color: white; background-color: #4caf50; padding: 15px 32px; text-align: center; text-decoration: none; border-radius: 4px; display: inline-block; font-size: 100%;">Hello</button> 
    </div> 
</div>

источник

2017-08-23 10:14:42

Как выровнять две кнопки отправки на одной строке

ответ

Смежные вопросы