CSS input textの右側に文字を重ねたい

Question

CSSでtextの右側に文字を重ねて表示したいです
下記ソースではうまくいきませんでした
うまく右側に重ねることは可能でしょうか？

<div style="position:relative">
<input type="text" style="width:30%">
<span style="width:30%;top:0%;right:0%;position:absolute">test</span>
</div>

<input type="text" style="position:relative;width:30%">
<span style="width:30%;top:0%;right:0%;position:absolute">test</span>
</input>

Comments

[yambejp]

具体的なイメージがわかりませんので、手書きでいいので画像で図示してください

[miyabi_pudding]

javascriptは何か関係しますか？
関係しないなら、質問タグは外しておきましょう。

Answer 1

divにdisplay: inline-block？