Question

我对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

Answer 1

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

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

我们在这里做的是我们使用相对定位设置跨度，因此它不会偏离（如绝对值）并设置负顶部位置以与图标对齐。

CSS定位问题[img | span]

1 个答案: