Clicking Bootstrap boot window in navbar does differently in chrome and firefox

Question

I have the following navigator on my website: the idea is that the logo, links and the search box with the button should appear on the same line, since it is currently displayed in Chrome:

However. when I open a website in Firefox, it displays as follows:

Here is the code:

<header>
        <nav class="navbar navbar-default" role="navigation" id="navbarStyle">             
          <div class="nav navbar-nav navbar-left">      
            <a href="<?=base_url()?>">Brand</a>
           </div> 

       <div class="nav navbar-nav navbar-right">                         
        <form class="navbar-form navbar-left navbar-search" role="search">
                        <div class="form-group">
                            <div class="input-group">
                            <div class="col-lg-1">    
                            <input type="text" class="form-control"placeholder="Search">
                            <button type="submit" class="btn btn-danger">
                            <span class="glyphicon glyphicon-search"></span>
                            </button>
                            </div>
                            </div>
                        </div>
                    </form>
                </div>

            <div>
                <ul class="nav nav-justified">
                    <li><a href="#">Link 1</a></li>
                    <li><a href="#">Link 2</a></li>
                    <li><a href="#">Link 3</a></li>
                    <li><a href="#">Link 4</a></li>
                </ul>
            </div>
        </nav>
    </header>

I struggled to fix this problem for several hours, but without any success. Any help would be much appreciated! Thank!

Answer 1

, , , - col-lg-1 div, . , 1/12 ( ). . div, . , , .

<span class="input-group-btn">..your button..</span>, - . http://getbootstrap.com/components/#input-groups-buttons

<header>
    <nav class="navbar navbar-default" role="navigation" id="navbarStyle">             
        <div class="nav navbar-nav navbar-left">      
            <a href="<?=base_url()?>">Brand</a>
        </div> 

        <div class="nav navbar-nav navbar-right">                         
            <form class="navbar-form navbar-left navbar-search" role="search">
                <div class="form-group">
                    <div class="input-group">
                        <input type="text" class="form-control" placeholder="Search">
                        <span class="input-group-btn">
                            <button type="submit" class="btn btn-danger">
                                <span class="glyphicon glyphicon-search"></span>
                            </button>
                        </span>
                    </div>
                </div>
            </form>
        </div>

        <div>
            <ul class="nav nav-justified">
                <li><a href="#">Link 1</a></li>
                <li><a href="#">Link 2</a></li>
                <li><a href="#">Link 3</a></li>
                <li><a href="#">Link 4</a></li>
            </ul>
        </div>
    </nav>
</header>

, , , , , . , .