如何从日期类型的输入字段中删除多余的空格

Question

我有一个div有一些输入，一个是日期类型，我想从元素中删除空格

这是代码

<div class="form-group form-inline">
        <input id="jumbotronSearch" type="text" class="form-control input-lg" placeholder="Location" min="5" max="50" required/> 
        <input id="jumbotronDate" type="date" class="form-control input-lg" value="@DateTime.Now.Date.ToShortDateString()" readonly/>
        <button id="jumbotronSearch" type="submit" class="btn btn-default btn-lg">Search</button>
    </div>

这就是它的样子。我想在日期之后撤回所有额外的空间。

我尝试将css宽度设置为100％和white-space：nowrap但是没有做到。

Answer 1

对于响应式解决方案，您尝试更改此内容：

<input id="jumbotronDate" type="date" class="form-control input-lg" value="@DateTime.Now.Date.ToShortDateString()" readonly/>

到

<input id="jumbotronDate" type="date" class="form-control form-date input-lg" value="@DateTime.Now.Date.ToShortDateString()" readonly/>

然后在css

.form-date{max-width:60%}

或者页面上只有一个日期

#jumbotronDate{max-width:60%}

由于为日期的宽度设置了引导值，因此请使用max-width覆盖它，或添加!important以覆盖任何引导约束。