【css】スクロールバーのみ非表示にし、リサイズの右下三角のみを表示させるには

Question

###わからないこと
いつもお世話になっております。
現在テキストフォームを、スクロールバー：非表示、リサイズ：表示　にしようとしていますが方法がわかりません。
ご教授いただけないでしょうか。

<div class="infobox">
ああああああああああああああああああああああああああああああああああああああ
</div>
<style type="text/css">
    div.infobox {
        height: 75px;  /* 高さを制限(※) */
        overflow-y: scroll; /* スクロールバーを表示(※) */
        border: #DDDDDD 1px solid;  /* 枠線を追加 */

    }
    .infobox::-webkit-scrollbar {
        display: none;
        resize: vertical;
    }
</style>

Answer 1

こういうことでしょうか。

    div.infobox {
        height: 75px;  /* 高さを制限(※) */
        overflow: hidden;
        border: #DDDDDD 1px solid;  /* 枠線を追加 */
        resize: vertical
    }

Codepen

Comments

[退会済みユーザー]

ご回答ありがとうございます。
ただその状態ですとスクロールができないのですが、できるようにすることは可能でしょうか？

[maisumakun]

内側にさらにエレメントを入れて、スクロールバーを右側にはみ出させてしまう、というような手段があるようです。

https://stackoverflow.com/questions/16670931/hide-scroll-bar-but-while-still-being-able-to-scroll