需要并排对齐引导元素

我想在一行中对齐两个输入元素，一个按钮和一个进度条（CSS和引导程序的新增内容）。该按钮不与输入元素正确对齐。进度条甚至不显示。我使用的html如下。需要并排对齐引导元素

<div class="form-group"> 
    <input type="text" class="form-control" placeholder="from"> 
    <input type="text" class="form-control" placeholder="to"> 
    <input type="submit" class="form-control btn btn-default" value="Route"> 
    <div class="progress-bar" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" style="width: 60%;"> 
</div>

来源

2016-09-20 Heisenberg

类form-inline添加到顶层的div（或父<form>）：

<div class="form-group form-inline"> 
    <input type="text" class="form-control" placeholder="from"> 
    <input type="text" class="form-control" placeholder="to"> 
    <input type="submit" class="form-control btn btn-default" value="Route"> 
    <div class="progress-bar" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" style="width: 60%;"> 
</div>

这里的relevant documentation

来源

2016-09-20 17:28:26 keithjgrant

感谢keithjgrant！解决方案是为两个输入元素和按钮工作，但进度条仍然不显示。任何想法？ – Heisenberg

@Heisenberg你错过了一些[required markup]（http://getbootstrap.com/components/#progress-basic）进度条。有**两个** DIV组成进度条。 – hungerstar

谢谢@hungerstar。 – Heisenberg

需要并排对齐引导元素

回答

相关问题