Wie zeige ich HTML <FORM> als Inline-Element an?

Dies ist wahrscheinlich eine grundlegende HTML / CSS-Frage ...

Ich habe ein einfaches Ein-Schaltflächen-Formular, das ich im Absatztext inline anzeigen möchte.

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

Obwohl das Formular das Attribut style = display: inline hat, wird vor dem Formular ein Zeilenumbruch angezeigt. Gibt es eine Möglichkeit, es loszuwerden?

Können Formularelemente im Inneren erscheinen <p>?

Bewegen Sie Ihr Formular-Tag direkt außerhalb des Absatzes und setzen Sie die Ränder / Auffüllungen auf Null:

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

<form>kann nicht hineingehen <p>, nein. Der Browser wird Ihr <p>Element abrupt schließen , wenn er auf das Eröffnungs- <form>Tag trifft, während er versucht, das zu verarbeiten, was er für ein nicht geschlossenes Absatzelement hält:

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

Sie können diesen Code ausprobieren:

<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> 

Das Wichtigste ist die CSS-Stileigenschaft im <form>Tag.

display:inline!important;

Laut HTML-Spezifikation sind beide <form>und <p>Blockelemente und können nicht verschachtelt werden. Vielleicht ist der Austausch <p>mit <span>für Sie arbeiten würde?

EDIT: Entschuldigung. Ich war zu schnell in meiner Formulierung. Das <p>Element erlaubt keinen Blockinhalt innerhalb - wie in der HTML-Spezifikation für Absätze angegeben .

Ich denke, Sie können das erreichen, was Sie wollen, indem Sie einfach die Schaltfläche "Senden" in den Absatz einfügen:

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

Verwenden Sie den Stil einfach float: leftso:

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

Fügen Sie einen Inline-Wrapper hinzu.

<div style='display:flex'>
<form>
 <p>Read this sentence</p>
 <input type='submit' value='or push this button' />
</form>
<div>
    <p>Message here</p>
</div>