html - CSS定位问题[img | span]

我对CSS很陌生，因此不擅长。我需要在图标旁边放置一个文本。如您所见，它只需要增加几个像素即可。我尝试了一下，但是没有用。我只是缺乏知识。您看到的摘录片段位于表数据字段中。

<td style="width:37%;" [class]="diffColorStatus(zeile)">
   <div class="status">
       <img class="statusIcon" src="../assets/rotZeichen.PNG" width="30px" *ngIf="diffColorStatus(zeile) == 'redMarkStatus'" />
       <img class="statusIcon" src="../assets/gelbZeichen.PNG" width="30px" *ngIf="diffColorStatus(zeile) == 'yellowMarkStatus'" />
       <img class="statusIcon" src="../assets/gruenZeichen.PNG" width="30px" *ngIf="diffColorStatus(zeile) == 'greenMarkStatus'" />
       <span id="statusText">{{zeile[0]}}</span>
   </div>
</td>

icon/text

最佳答案

一个非常快速的解决方法是将以下样式应用于范围（id = statusText）：

#statusText {
  position: relative;
  top: -2px;
}

我们在这里所做的是，我们将跨度设置为相对位置，这样它就不会漂移（像绝对值一样），并设置一定数量的负顶部位置以与图标对齐。