Bootstrap justify-content 不适用于表单答案

【问题标题】：Bootstrap justify-content not working with formBootstrap justify-content 不适用于表单
【发布时间】：2021-05-17 17:41:55
【问题描述】：

我有一个用于捕获 Twitter 句柄的输入表单。我只是想将输入和提交按钮置于页面中心，但由于某种原因，我无法使用它。这是 CSS/HTML 的相关 sn-p（另请注意，我使用的是 Bootstrap 和 ASP.NET）

<form asp-action="GetTwitterHandle">
    <div class="submitView">
        <input name="UserHandle" class="form-control" placeholder='&#64Example_User'/>
        <input type="submit" class="btn btn-primary" value="Get Stats" />
    </div>
</form>

.submitView {
    border: 1px solid orange;
    height: auto;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 50%;
}

【问题讨论】：

标签： html css asp.net bootstrap-4

【解决方案1】：

在 submitView 类中设置 height: 100vh;。它将水平和垂直对齐项目。

【讨论】：

【解决方案2】：

如果你想要这样的东西...删除 width: 50% 并添加 height: 100vh;

如果没有帮助，请通过评论告诉我。

【讨论】：

我只有它，因为没有它，文本框几乎跨越了整个页面。虽然它在 JSFiddle 中没有这样做，所以也许它与我缺少的另一个动作有关？
我刚刚在 JSfiddle 中做了同样的事情。它正在工作。这段代码是一小段，对吧？也许是其他原因导致了问题。