How can I put a button inside text without line-breaks occuring?

I would like to put a button inside text like this one:

some text1 [button] some text2.

However if I place form&input, line break occures before and after my button like this:

some text1
[button]
some text2

I know I can do this with tables, but I want to avoid it. Is there any CSS based soluti开发者_JAVA技巧on to do this? Unfortunately, I can't modify the HTML code, so I have to "inject" that little form statement (with input type submit, and some hidden input tags too) in the generated HTML (done by other software), so it would be hard to reformat it, using tables, etc.

Is it even legal to put form/input tags within text which is enclosed between 'p' tags?

Thanks in advance.

---

The css solution is white-space:nowrap. Wrap it with a span tag with that rule. For example, assuming you have this rule in the your css file:

.nowrap {
    white-space:nowrap
}

You can do it with this html:

<span class="nowrap">some text1 <button>test</button> some text2</span>

---

If I understand your question correctly, you're injecting a form that contains a button into some text and the form tag is causing the text to wrap (form is a block level element). This is a simple fix with CSS:

HTML:

some text <form><button>test</button></form> some text

CSS:

form
{
    display:inline;
}

If you don't want to make a blanket change to all the form elements, simply assign the injected form a CSS class:

HTML:

some text <form class="inlineForm"><button>test</button></form> some text

CSS:

.inlineForm
{
    display:inline;
}

Alternative:

You could also add display:inline directly to the form tag:

some text <form style="display:inline"><button>test</button></form> some text

Here's a working jsFiddle.

---

You should add style="display:inline" to the form tag

hello <form  style="display:inline"><input type="hidden" value="blah"/><input type="submit" /></form>world

gives

hello [button] world

---

try to make all blocks among your text - inline.

like that:

<form style="display: inline">

If there are divs after your form, make them inline too