如何将内容限制为模态对话框宽度？

Question

我在模态对话框中有很长的文本字符串，但文本没有换行或留在对话框内。 我怎样才能解决这个问题？ 下面是一个图像和我的对话框模板。

<div class="modal modal-backdrop" tabindex="-1" role="dialog" [ngStyle]="{display: shareLinkShowDialog ? 'block' : 'none'}">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title">
                    Share Link to {{selectedHouseMember.getName()}}
                </h5>
            </div>
            <div class="modal-body" style="text-align: center;">
                <p>{{shareLink}}</p>
            </div>
            <div class="modal-footer">
                <button class="btn btn-warning" (click)="toggleShareLinkDialog()">
                    Close
                </button>
            </div>
        </div>
    </div>
</div>

Answer 1

用

宽度：100%； 最大宽度：100%；

给父母

Answer 2

<div class="modal-body" style="text-align: center; word-wrap: break-word;">
     <p>
        {{shareLink}}
     </p>
</div>

使用word-wrap: break-word; . 我参考了这个问题： html - Bootstrap modal水平文本溢出