CSSで横方向の可変ボックスの作り方

質問

[ ]　←画像（縦方向のグラデーション）

[ テキスト ]
[ テキストテキストテキスト ]

上記のようにテキストの量によって自動で背景画像が可変するような
CSS指定をしたいのですが、これって可能でしょうか？
縦の可変はわかるのですが、横の可変がわかりません…

すみませんが、わかるかたいましたらご教授お願いします。

回答No.2

tenderfeel

<div class="box">テキストテキストテキスト</div>

#box{
background:url(image.jpg) repeat-x left top;
width:auto;
height:auto;
}

repeat-x（x方向にリピート）の事かなあ

回答No.1

goldfox

表示領域の幅によって可変するboxならわかるけど、テキストの量で可変するboxってあったかな…？
ひょっとしてpre利用とか？

<div style="width:20%; background-image:url(背景画像);border:1px solid #000000;">
テキストテキストテキストテキストテキストテキストテキストテキストテキスト
</div>
<div style="width:20%; background-image:url(背景画像);border:1px solid #000000;">
<pre>テキストテキストテキストテキストテキストテキスト
テキストテキストテキスト</pre>
</div>