Navbar调整大小问题

时间:2015-10-09 13:37:18

标签: twitter-bootstrap twitter-bootstrap-3

使用bootstrap 3,我创建了这个导航栏。

我遇到的问题是尺寸。当我调整屏幕大小时,结果不好。

<div class="container">
    <div class="row">
        <div class="navbar" role="navigation">
            <div class="col-sm-6 col-md-12">
                <form class="navbar-form" role="search" id="search-form" name="search-form">
                    <div class="btn-group pull-right" style="margin-left:10px;">    <a class="btn btn-primary dropdown-toggle" data-toggle="dropdown" href="#">Mumbai <span class="caret"></span></a>

                        <div class="dropdown-menu multi">
                            <div class="container">
                                <div class="row">
                                    <div class="col-lg-4">
                                        <ul class="dropdown-menu">
                                            <li><a href="#"><strong>Mumbai</strong></a>

                                            </li>
                                        </ul>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="btn-group pull-left checkbox" style="margin-right:10px;">
                        <label>
                            <input type="checkbox" id="inactiveLodger">Locataire inactif</label>
                    </div>
                    <div class="input-group">
                        <input type="text" class="form-control" placeholder="Rechercher" name="srch-term" id="srch-term">
                        <div class="input-group-btn">
                            <button id="lodgerSearch" type="button" class="btn btn-default"><i class="glyphicon glyphicon-search"></i>

                            </button>
                        </div>
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>

就像你在图片中看到的那样,当屏幕尺寸很大时,条形图的尺寸看起来很小。

有没有办法解决这个问题?

我想留下第一张图片的结果。

enter image description here

jsfiddle demo

2 个答案:

答案 0 :(得分:0)

希望它能为您解决问题并解决问题

替换此

public class B extends A {

    // class B has member x in field which is extended from class A

    void action(A ob1, B ob2, C ob3) {
        x = 10;     // <-- this is extended field member x from class A in class B
        ob1.x = 10; // <-- this is protected member of other instance of A
        ob2.x = 10;
        ob3.x = 10;
    }
}

用这个

<div role="navigation" class="navbar">
            <div class="col-sm-6 col-md-12">

答案 1 :(得分:0)

我修好了。刚删除<div class="col-sm-6 col-md-12">,然后将行<div class="navbar">替换为<div class="container">

<强> See the result in JSFIDDLE