Bootstrapでdiv内にある画像の幅分に文字列を折り返したい

実現したいこと

イメージ説明
↑図のようにこういうようにしたいです。

発生している問題・分からないこと

イメージ説明
このように、divの幅分だけ文字列が横に広がってしまいます。
どうやったら画像の幅分だけ、文字列を折り返すことができますか?

該当のソースコード

<div class=" p-0 m-0 text-center small w-auto p-2"> <a href="ssss"><img class="" src="{{$data->imgPath}}" alt="{{$data->imgAlt}}" style="width: 130px;"></a> <br> <div > <span>あああああああああああああああああああああああああああああ</span> </div> </div>

試したこと・調べたこと

上記の詳細・結果

Googleで「bootstrap div 幅 文字 調整」などで調べましたが、うまくヒットしませんでした。

補足

Bootstrap 4.3.1バージョンを使っています。

コメントを投稿

0 コメント