ここでの私の問題は、私の「OCD」が私を殺しているということです。
https://jsfiddle.net/3esrpdLt/1/
<table style="width:100%;">
<tr>
<td class="quoteprice">
<div class="form-group">
<label>Subtotal: </label>
</div>
</td>
<td>
<div class="input-group">
<div class="input-group-addon currency">$</div>
<input value="<?php echo isset($invoice['data']['subTotal']) ? $invoice['data']['subTotal']: ''; ?>" type="number" class="form-control" name="data[subTotal]" id="subTotal" placeholder="Subtotal" onkeypress="return IsNumeric(event);" ondrop="return false;" onpaste="return false;">
</div>
</td>
</tr>
<tr>
<td class="quoteprice">
<div class="form-group">
<label>ITBIS: </label>
</div>
</td>
<td>
<div class="input-group">
<div class="input-group-addon currency">$</div>
<input value="<?php echo isset($invoice['data']['subTotal']) ? $invoice['data']['subTotal']: ''; ?>" type="number" class="form-control" name="data[subTotal]" id="subTotal" placeholder="Subtotal" onkeypress="return IsNumeric(event);" ondrop="return false;" onpaste="return false;">
</div>
</td>
</tr>
<tr>
<td class="quoteprice">
<div class="form-group">
<label>Descuento: </label>
</div>
</td>
<td>
<div class="input-group">
<div class="input-group-addon currency">%</div>
<input value="<?php echo isset($invoice['data']['subTotal']) ? $invoice['data']['subTotal']: ''; ?>" type="number" class="form-control" name="data[subTotal]" id="subTotal" placeholder="Subtotal" onkeypress="return IsNumeric(event);" ondrop="return false;" onpaste="return false;">
</div>
</td>
</tr>
<tr>
<td class="quoteprice">
<div class="form-group">
<label>Total: </label>
</div>
</td>
<td>
<div class="input-group">
<div class="input-group-addon currency">$</div>
<input value="<?php echo isset($invoice['data']['subTotal']) ? $invoice['data']['subTotal']: ''; ?>" type="number" class="form-control" name="data[subTotal]" id="subTotal" placeholder="Subtotal" onkeypress="return IsNumeric(event);" ondrop="return false;" onpaste="return false;">
</div>
</td>
</tr>
jsfiddleでわかるように、問題は、「%」アイコンを使用すると、他のアイコンよりも少し大きくなることです。これを防ぐ方法はありますか?
それらをすべて大きくしたい場合は、これをCSSに追加します。
.input-group-addon {
min-width: 40px;
}
または、%
トリミングする場合は、次を使用します。
.input-group-addon {
max-width: 33px;
}
これはあなたが望むものですか?
この記事はインターネットから収集されたものであり、転載の際にはソースを示してください。
侵害の場合は、連絡してください[email protected]
コメントを追加