Html 更改跨度的尺寸

我有一个这样的工具提示

.calendar-tooltip:hover .calendar-tooltiptext {
    visibility: visible;
    opacity: 1;
    display: block;
    position: absolute;
    height: 100%;
}


<div class="my-template-cell">
          <span class="cal-day-number">{{ day.date | calendarDate:'monthViewDayNumber':locale }}</span>
      </div>
      <span *ngIf="isHoliday(day)" class="calendar-tooltiptext"> Vacation  </span>
      <span *ngIf="isNationalHoliday(day)" class="calendar-tooltiptext"> National Holiday </span>

我的代码是这样的

.calendar-tooltip:hover .calendar-tooltiptext {
    visibility: visible;
    opacity: 1;
    display: block;
    position: absolute;
    height: 100%;
}


<div class="my-template-cell">
          <span class="cal-day-number">{{ day.date | calendarDate:'monthViewDayNumber':locale }}</span>
      </div>
      <span *ngIf="isHoliday(day)" class="calendar-tooltiptext"> Vacation  </span>
      <span *ngIf="isNationalHoliday(day)" class="calendar-tooltiptext"> National Holiday </span>

。日历工具提示：悬停。日历工具提示文本{
能见度：可见；
不透明度：1；
显示：块；
位置：绝对位置；
身高：100%；
}
{day.date | calendarDate:'monthViewDayNumber'：locale}
假期
国庆节

我需要的是，如果我有更多的文本，工具提示的高度会改变。

---

我试过使用60%的高度，但第二行没有出现，100%的高度对于一行来说太大了。

如注释添加

height:auto

，然后尝试

minheight:60%
只要您的工具提示文本给出
高度：100%将是这样的-不是更多，也不是更少

如果按照MrLister的建议删除height属性，文本将超出底部边框（只要父元素上没有
overflow:hidden；
）

我建议使用
minheight:100%如果您总是想要最小完整单元格高度。
如果您将
高度：auto
指定给span？或者将
高度
全部删除。这些值是这样填充的还是仅在悬停状态下填充的？如果允许您更改它，我的意见是使用文本椭圆，然后悬停以在覆盖类型中获取更多详细信息。请粘贴一把代码，以便我们检查并解决问题。