Blazor-使InputText适合父容器

Question

我想制作一个在同一行上有多个InputText的表单。但是InputText的宽度总是203px。如何指定InputText以适应父宽度？

<div class="row">
<div class="col-2">
<label>Address</label>
</div>
<div class="col-3">
<InputText @bind-Value="Address.Postcode" placeholder="Postcode" />
</div>
<div class="col-3">
<InputText @bind-Value="Address.HouseNumber" placeholder="House Nb" />
</div>
<div class="col-4">
<InputText @bind-Value="Address.Street" placeholder="Street" />
</div>
</div>

Answer 1

将style="width: 100%"添加到输入

<div class="row">
<div class="col-2">
<label>Address</label>
</div>
<div class="col-3">
<InputText style="width: 100%;" @bind-Value="Address.Postcode" placeholder="Postcode" />
</div>
<div class="col-3">
<InputText style="width: 100%;" @bind-Value="Address.HouseNumber" placeholder="House Nb" />
</div>
<div class="col-4">
<InputText style="width: 100%;" @bind-Value="Address.Street" placeholder="Street" />
</div>
</div>