根据顶层元素的内容动态定位内容

Question

<p>标签的内容是动态加载的，并且高度不同。我将ion-button的位置用作固定的top等，例如margin-top: -20px;。但这不适用于p有大数据的情况。那你能告诉我如何处理吗？即我需要动态调整ion-button的位置。

.html

<ion-row>
  <ion-col size="12">
    <h3 class="title">{{ data?.name }}</h3>
    <p class="opening" [innerHTML]="data?.workingHours"></p>
    <ion-button *ngFor="let button of data.buttonlinks" fill="outline" 
      class="menu-button" color="primary">
      {{ button.name }}</ion-button>
    <div class="inner-html" [innerHTML]="data.description"></div>
  </ion-col>
</ion-row>

.scss

.opening {
    font-size: 14px;
    font-weight: 500;
    color: #4A4A4A;
}

.menu-button {
    margin-top: -20px;
    margin-bottom: 16px;
    margin-left: 16px;
}

UI：

Answer 1

s5