css - 如何为 Angular mat-dialog 中的元素添加响应式底部边距

Question

我正在使用 Angular mat-dialog 向用户显示一些文本。我无法管理我的元素来为大、小、中的屏幕和文本设置特定的边距底部。这是我的代码。

.HTML 文件

        <div class ='container'>
            <mat-dialog-content>
                <button mat-icon-button class="close-button close icon-outside" [mat-dialog-close]="true">
                    <mat-icon class="close-icon material-icons color_white">close</mat-icon>
                </button>
                <div class='logo_title'>
        
                    <h1 class='h1' mat-dialog-title>{{data.website}}</h1>
                    
                </div>
                <hr class="solid">

                <p class="text-justify paragraph paragraphscroll">{{data.profile}}</p>

            <div class="btm">
                <p class='oppppp paragraph'> Contact Details: {{data.email_contact}}</p>
                <p class='paragraph' >  Website: <a href="{{data.website_url}}" target="_blank">{{data.website_url}} </a></p>
            </div>

        </mat-dialog-content>
        </div>
    

创建对话框。

    const dialogRef = this.dialog.open(OrgDialogComponent, {
      width: '60%',
      height: '70%',
      data: this.org_result,
      panelClass: 'my-dialog2',
    });

你可能会看到附图。在此处输入图像描述

我希望 div.btm 中出现的两段应该靠近对话框的底部。

非常感谢您的帮助。