在iPhone上，具有“ datepicker”类的Input元素不会覆盖整个列宽

Question

我正在尝试呈现日期选择器输入。我希望输入字段跨越列的整个宽度。在Android（Chrome）上看起来不错，但在iOS（Safari）上，输入字段用于包装文字。所附图片在左侧显示ios，在右侧显示android。我希望ios显示的输入字段与android显示的相同。

以下是代码：

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.0/css/bootstrap.min.css">
  <script src='https://kit.fontawesome.com/a076d05399.js'></script>  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.0/js/bootstrap.min.js"></script>
<div class="container">
	<div class="row">
		<div class="col-xs-12" style="padding-left: 0px">
			<div class="date input-group">
				<input type="Date" name="123" class="datepicker form-control" value="2019-09-21" autocomplete="off">
				<span class="input-group-addon">
					<i class="fas fa-calendar-alt"></i>
				</span>
			</div>
		</div>
	</div>
</div>

Answer 1

尝试添加最小宽度：

<input type="Date" name="123" class="datepicker form-control" value="2019-09-21" autocomplete="off" style="min-width:95%;">