![](http://oshiete.xgoo.jp/images/v2/pc/qa/question_title.png?5a7ff87)
テキストボックスの高さを可変とし、ある高さ以上でスクロールバーを出したい
以下のように
________
|コメント。 |
| |
----------------
↓
________
|コメント。 |
|コメント。 |
|コメント。 |
|コメント。 |
|コメント。 |
|コメント。 |
----------------
↓
________
|コメント。 ∥
|コメント。 ∥
|コメント。 ∥
|コメント。 ∥
|コメント。 ∥
|コメント。 ∥
----------------
∥スクロールバー
cssの{overflow: auto;}
でスクロール可視の自動設定はできますが、この
ばあい高さが固定されてしまいます。高さを設定しないと、
外枠に設定した高さ=この枠の高さとなってしまいます。
そうではなく、ミニマムの高さ、マックスの高さを設定してスクロールバーを
自動表示させるようにするにはなにか方法はないでしょうか?
お知恵をお貸しください。よろしくお願いします。
![](http://oshiete.xgoo.jp/images/v2/common/profile/M/noimageicon_setting_04.png?5a7ff87)
No.1ベストアンサー
- 回答日時:
<div style="border:5px #000000 double;width:150px;min-height:50px;max-height:100px;overflow:auto;">
1<br />2<br />3<br />4<br />5<br />6<br />7<br />8<br />
</div>
↑こういう事でしょうか?
内容が50px未満の場合(1~3行目まで)はボックスの高さを50pxとし、
内容が50px以上100px未満の場合(4~6行目まで)は内容に合わせてボックスが可変し、
それ以降はボックスの高さが100pxで固定となりスクロールバーが出ます。
横幅の場合も同様に、min-width,max-widthと指定します。
ただ、この方法はFirefox,Netscape,Opera,Safariなどは対応していますが、IEは対応していないので、IEで同様の表示をする場合はHTML+CSSだけではできないかと思います。
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- YouTube YouTubeのコメントについて。 普通だったら高評価とか低評価とかのボタンの下からコメントが見れま 3 2022/08/19 23:30
- YouTube YouTubeコメント。 1 2022/04/23 09:43
- Excel(エクセル) セルに設定した[コメント]、表示のON/OFFは正常なるも印刷されない! 3 2022/09/18 21:56
- YouTube YouTube動画。 1 2022/04/15 17:56
- その他(SNS・コミュニケーションサービス) ヤフーのニュースにコメントしようとしたら下記のメッセージが出て来てコメントできません 1 2022/12/03 17:34
- YouTube YouTube動画へのコメント投稿で「いいね」が低評価 YouTube動画(主に政治経済関連)によく 1 2022/10/31 16:55
- その他(ブログ) 最近コメント欄について 4 2023/05/14 09:08
- livedoor Blog(ライブドアブログ) livedoorブログのコメント欄を個々の記事ごとに表示したいのですが。 1 2022/08/30 18:49
- YouTube YouTube、高評価、低評価。 2 2022/07/21 13:19
- その他(IT・Webサービス) ユーチューブ動画への質問の仕方 1 2023/05/24 15:55
関連するカテゴリからQ&Aを探す
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
htmlの文字が縦書きになる
-
widthやheightの数値に単位(px...
-
コンボボックスの幅
-
ライトボックスでスクロールバー
-
画像イメージの上下左右、欲し...
-
【HTML&CSS】フッター下部の余...
-
余分な縦スクロールバーが出て...
-
CSS/HTML で画像 2枚重ねた上に...
-
CSSのposition値の上書き(打消...
-
表示倍率を変えるとレイアウト...
-
幅違うメニュー(リスト)、flo...
-
吹き出し 下記の吹き出しのスタ...
-
テキストボックスの高さを可変...
-
footer を横幅いっぱいに広げる...
-
form input テキストを上下中央...
-
Media Queries 4 で 非推奨とな...
-
【HTML】【CSS】【Swiper】 元...
-
cssが効かなくて困ってます
-
HTMLのiframeの入れ子について
-
CSS3で角丸写真にシャドーを付...
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
htmlの文字が縦書きになる
-
widthやheightの数値に単位(px...
-
画像イメージの上下左右、欲し...
-
CSS、width100%でもできる余白
-
CSSがなぜかfont-sizeだけ効か...
-
css初心者 フレックスボックス...
-
余分な縦スクロールバーが出て...
-
CSS:animation開始位置の設定
-
form input テキストを上下中央...
-
W3Cのソースコードの検証サービ...
-
スクロールボックスを中央に配...
-
CSSでボックスのheightが0になる
-
表示倍率を変えるとレイアウト...
-
【CSS】ヘッダーの高さが不明の...
-
Media Queries 4 で 非推奨とな...
-
div領域をウインドウサイズに合...
-
CSS(0の単位)について
-
divで囲まれたpaddingの指定を...
-
中点「・」の改行について
-
CSSで指定した背景画像にリンク...
おすすめ情報