So a webpage displays a long amount of text in paragraph format. The goal is place an element, such as a picture or bit of text, next to paragraph 17 or 26 without changing the paragraph in any way (i.e. the paragraph shouldn't have to wrap around it).
Thus far the best way to do this that I can see is wrapping the text in a table, a column for the text (and one paragraph on each row), and an empty that can be filled with the placed element by ID (the ID being a row number).
This seems rather clunky. For one thing, if the added element is longer vertically than the paragraph, a gap will be created in the original text. For another, each paragraph now looks like
<tr><td><p> garble fizz thoutrious</p></td><td id = "#"***></td></tr>
Can anyone think of a suitable alternative?
***Then with jQuery it's easy to grab that td id and fill it with whatever I want.
EDIT after Andre's answer:
So I have a series of paragraphs.
<p>Thing thing thing</p>
<p>Thang Thang Thang</p>
<p>Sing Sing Sing</p>
<p>Song Song Song</p>
I want to be able to add text or an image or some element to, say, the third paragraph, to get something like:
<p>Thing thing thing</p>
<p>Thang Thang Thang</p>
<p>Sing Sing Sing</p><img>
<p>Song Song Song</p>
With a layout like:
[p ]
[p ]
[p ][img]
[p ]
... where width is fixed
The problem I see with Andre's solution is that... actually, no, an empty span will fit fine, have an ID associated with the paragraph to which it's bound so that it can be filled as needed, and each paragraph can clear.
And there shouldn't be any gaps between [p ] when [img] is taller.
I'm going to test it out and then award the answer I think.