Specific method of captioning images/objects is needed

I've long been frustrated in my attempts to create on-line magazing content that contains a fair number of images with captions in a way that is both pleasing to the eye and validates against the most recent HTML and CSS specifications. I've never found a satisfactory solution, and have come to the conclusion that we need something like a new attribute or subtag for <object> to house a caption, along with a better method than floating to position images with captions.

I'd like to see something like <caption></caption> allowed to be nested inside a (possibly nested) <caption> element, and have it rendered if any of the nested <object>s are actually displayed. Then it could be formatted and positioned just like a table <caption> can.

But there still exists the problem of positioning the image and its caption. Since web pages can reflow according to the size of the browser window, some provision needs to be made for placing the pair near the reference in the text. Currently this must be done by placing <img> and <span> tags inside a paragraph, next to the reference. But this limits formatting options and puts extraneous text in the middle of the flow (making text copied to the clipboard a jumble of content and caption).

So I'd like to see a variation on float: or position:relative that could be made relative to an ID. This could be a named paragraph or a named <span>. Such a structure would also be useful for side notes and footnotes.