bootstrap gridにて英数字がうまく表示されない時の修正

bootstrap gridにて英数字がうまく表示されない場合の対策は別途CSSにてclassを下記の様に作成し対応。

    <style>
        .custom-break {
                overflow-wrap: break-word;
                word-wrap: break-word; /* 古いブラウザとの互換性のため */
            }
    </style>
    
<div class="row">
  <div class="col-sm-3">aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa</div>
  <div class="col-sm-3">col2</div>
  <div class="col-sm-3">col3</div>
  <div class="col-sm-3">col4</div>
</div>
対策後
<div class="row">
  <div class="col-sm-3 custom-break">aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa</div>
  <div class="col-sm-3 custom-break">col2</div>
  <div class="col-sm-3 custom-break">col3</div>
  <div class="col-sm-3 custom-break">col4</div>
</div>

実例

対応後