4

我正在使用 Bootstrap 3。我在行内使用了两col-md-4col-md-2。现在我试图将两列居中。我已经使用text-left了,col-md-2因为其中的按钮需要左对齐。我使用以下代码将列居中,但它不适用于我。

<div class="jumbotron">
    <div class="row text-center">
        <div class="col-md-4">
            <div class="input-group input-group-lg">
                <div class="input-group-btn text-left">
                    <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">option 1<span class="caret"></span></button>
                    <ul class="dropdown-menu">
                        <li><a href="#">option 1</a></li>
                        <li><a href="#">option 2</a></li>
                        <li><a href="#">option 3</a></li>
                    </ul>
                </div><!-- /btn-group -->
                <input type="text" class="form-control">
            </div><!-- /input-group -->
        </div>
        <div class="col-md-2 text-left">
            <button type="button" class="btn btn-default btn-lg">  Search  <span class="glyphicon glyphicon-search"></span></button>
        </div>
    </div><!-- /row -->
</div>
4

1 回答 1

5
<div class="jumbotron">
<div class="row">
    <div class="col-md-4 col-md-offset-3"> //The one i added
        <div class="input-group input-group-lg">
            <div class="input-group-btn text-left">
                <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">option 1<span class="caret"></span></button>
                <ul class="dropdown-menu">
                    <li><a href="#">option 1</a></li>
                    <li><a href="#">option 2</a></li>
                    <li><a href="#">option 3</a></li>
                </ul>
            </div><!-- /btn-group -->
            <input type="text" class="form-control">
        </div><!-- /input-group -->
    </div>
    <div class="col-md-2 text-left">
        <button type="button" class="btn btn-default btn-lg">  Search  <span class="glyphicon glyphicon-search"></span></button>
    </div>
</div><!-- /row -->

希望这个Bootply 有帮助!也看看这个维基

于 2013-11-09T10:26:41.573 回答