texto - formularios html css

¿Cómo mostrar HTML<FORM> como elemento en línea?

Question

Esta es probablemente una pregunta básica sobre html / css ...

Tengo un formulario simple de un botón que me gustaría mostrar en línea dentro del texto del párrafo.

<p>Read this sentence
<form style=''display:inline;''>
<input style=''display:inline;''
type=''submit''
value=''or push this button''/>
</form>.
</p>

Aunque el formulario tiene el atributo style = display: inline, obtengo un linebreak antes del formulario. ¿Hay alguna manera de librarse de ello?

¿Pueden aparecer elementos dentro de <p> ?

Answer 1

Mueva su etiqueta de formulario justo fuera del párrafo y establezca los márgenes / relleno en cero:

<form style="margin: 0; padding: 0;">
<p>
Read this sentence
<input style="display: inline;" type="submit" value="or push this button" />
</p>
</form>

Answer 2

Puede lograr lo que quiera, creo, simplemente incluyendo el botón de enviar dentro del párrafo:

 <pre>
<p>Read this sentence <input type=''submit'' value=''or push this button''/></p>
</pre>

Answer 3

Puedes probar este código:

<form action="#" method="get" id="login" style=" display:inline!important;">
<label for=''User''>User:</label>
<input type=''text'' name=''User'' id=''User''>
<label for=''password''>Password:</label><input type=''password'' name=''password'' id=''password''>
<input type="submit" name="log" id="log" class="botton" value="Login" />
</form>

Lo importante a tener en cuenta es la propiedad de estilo css en la etiqueta <form> .

display:inline!important;

Answer 4

Según las especificaciones de HTML, tanto <form> como <p> son elementos de bloque y no puede anidarlos. Tal vez reemplazar el <p> con <span> podría funcionar para usted?

EDITAR: Lo siento. Fui rápido en mi redacción. El elemento <p> no permite contenido de bloque dentro de la especificación de HTML para los párrafos .

Answer 5

Solo usa el estilo float: left de esta manera:

<p style="float: left"> Lorem Ipsum </p>
<form style="float: left">
<input type=''submit''/>
</form>
<p style="float: left"> Lorem Ipsum </p>

Answer 6

<form> no puede entrar <p> , no. El navegador cerrará abruptamente su elemento <p> cuando llegue a la etiqueta de apertura <form> mientras trata de manejar lo que cree que es un elemento de párrafo no cerrado:

<p>Read this sentence
</p><form style=''display:inline;''>