html - 元素被迫向右浮动，但不应该

Question

我希望以下输入字段向左浮动。我尝试float: left并text-align: left作为父属性。具有硬编码像素的解决方案（例如padding、margin、position:relative等）可以工作，但不是我想要的。

HTML

<ng-container matColumnDef="number">
  <mat-header-cell mat-sort-header arrowPosition="before" class="matTable numberHeaderCell" >
    <input type="text" class="tabHeadInputField numberInputField"/>
  </mat-header-cell>
  <mat-cell class="matTable numberBodyCell">
    {{row.workingNumber}}
  </mat-cell>
</ng-container>

CSS

.matTable.numberHeaderCell {
  border: 1px solid black;
}

.matTable.numberBodyCell {
  text-align: left;
}

.tabHeadInputField.numberInputField {
  float: left;
}

标签： htmlcssangular-material

Answer 1

我将其更改arrowPosition="before"为arrowPosition="after".

这迫使浮动远离箭头位置。