Question

我尝试使用页脚/底部导航，并放置一个按钮而不是＆＃34;品牌＆＃34;

但是，按钮没有左对齐（与文字品牌相比），但略微缩进。

      <footer>
                            <nav class="navbar navbar-default navbar-fixed-bottom">
                                      <div class="container-fluid">
                                                    <div class="navbar-header">
                                                        <li class="dropup">
                                                             <!--   <a href="#" class="dropdown-toggle" data-toggle="dropdown">wybierz region<b class="caret"></b></a> -->
                                                               <button type="button" class="navbar-brand btn btn-default btn-lg dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" style="margin-left: 40px;">
                                                              <i class="fa fa-globe" style="color:green"></i> Language: English<span class="caret"></span>
                                                              </button>
                                                                <ul class="dropdown-menu columns">
                                                                    <li><a href="#"><strong>English</strong></a></li>
                                                                    <li><a href="#">Français</a></li>
                                                                    <li><a href="#">Deutsch</a></li>
                                                                    <li><a href="#">Español</a></li>
                                                                    <li><a href="#">עברית</a></li>
                                                                    <li><a href="#">العربية</a></li>
                                                                    <li><a href="#">Italiano</a></li>
                                                                    <li><a href="#">Русский</a></li>
                                                                    <li><a href="#">Türk</a></li>
                                                                    <li><a href="#">Magyar</a></li>
                                                                    <li><a href="#">中文</a></li>
                                                                    <li><a href="#">日本語</a></li>
                                                                </ul>
                                                              </li>

                                                </div>                                              
                                      </div>
                            </nav>

    </footer>

我想知道造成这种情况的原因，以及 bootstrapeeze 解决此问题的方法

建议表示赞赏

Answer 1

只需使用padding-left：0px in div with class =＆＃34; container-fluid＆＃34;并且按钮中的样式应该是0px左边的边距

  <footer>
                                <nav class="navbar navbar-default navbar-fixed-bottom">
                                          <div class="container-fluid" style="padding-left:0px;">
                                                        <div class="navbar-header" >
                                                            <li class="dropup ">
                                                                 <!--   <a href="#" class="dropdown-toggle" data-toggle="dropdown">wybierz region<b class="caret"></b></a> -->
                                                                   <button type="button" class="navbar-brand bg-success dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" style="margin-left:0px;">
                                                                  <i class="fa fa-globe" style="color:green"></i> Language: English<span class="caret"></span>
                                                                  </button>
                                                                    <ul class="dropdown-menu columns">
                                                                        <li><a href="#"><strong>English</strong></a></li>
                                                                        <li><a href="#">Français</a></li>
                                                                        <li><a href="#">Deutsch</a></li>
                                                                        <li><a href="#">Español</a></li>
                                                                        <li><a href="#">עברית</a></li>
                                                                        <li><a href="#">العربية</a></li>
                                                                        <li><a href="#">Italiano</a></li>
                                                                        <li><a href="#">Русский</a></li>
                                                                        <li><a href="#">Türk</a></li>
                                                                        <li><a href="#">Magyar</a></li>
                                                                        <li><a href="#">中文</a></li>
                                                                        <li><a href="#">日本語</a></li>
                                                                    </ul>
                                                                  </li>

                                                    </div>                                              
                                          </div>
                                </nav>

        </footer>

Bootstrap 3.3.6 - 在页脚导航中放置按钮会生成带符号的按钮

1 个答案: