I'm encountering an issue with the width of an input element within a table cell. The input element is defined in the following way:
<td><input class="form-control input-small my-input-narrow" type="number"></td>
Unfortunately, the width of the table cell is much wider than the input element itself, causing layout problems.
Upon inspecting the element using Chrome, the computed style tab reveals:
margin-bottom: 0px;
margin-left: 0px;
margin-right: 0px;
margin-top: 0px;
Oddly enough, when examining the metrics and hovering over the Margin attribute, a wide area as margin is displayed despite showing "-" as the width of the margin. The computed style for the td indicates a width of 219px, while the input element is only 33px wide.
If you have any suggestions on how I can better understand this rendering issue, please let me know!
Thank you!