“浮动”注释与HTML / CSS / JavaScript /任何

我有一个带有一些注释的文本文档,我想让它们出现在他们附带的文本附近,在一个网页上.

也就是说,我想转换这样的东西：

The Houdan hen was never drawn into the
   cult of Sredni Vashtar. Conradin had
   long ago settled that she was an
   Anabaptist. He did not pretend to have        [23]
   the remotest knowledge as to what an
   Anabaptist was,but he privately hoped
   that it was dashing and not very
   respectable.

适当地,使得在浏览器中,[23]被显示在与“假装有”一词相同的行上(优选地在页面上的左边或右边的“边缘”)的任何位置,无论字体大小或者哪一行休息可能是.这是可能的,任何混合的CSS / JavaScript /预处理,无论什么？

请参阅(the left margin on) this page以了解我想要做的一个例子：文本附带页码.除了文本不仅仅是< pre&gt,之前的所有文字,所以我不能完全复制他们做什么. (我想可以将所有注释移动到段落的顶部/底部,并将它们显示在那里,但我真的不喜欢这样.) 我意识到这个问题可能是模糊的,但我可以接受建议. [注意：我不需要任何东西来“浮动”在技术(CSS /任何)意义上;我只是想象,在文字中段旁边有这些“注释”需要一些浮动的东西.我打开一个更好的问题的建议:)] 更新：另外,如果“注释”不仅仅是一个数字,你的方法是否有效,例如小段落本身或图像？

.on-margin {
        position: absolute;
        right: 10%;      /* right margin from the containing box */
    }