Question

我是网页设计的新手，我需要帮助调整网页导航栏中的facebook登录按钮。现在，按钮环绕到导航栏中的下一行，当我将按钮放在＆lt; \ li＆gt;中时标记它仍然没有对齐。附上下面的html代码以供参考。我使用bootstrap css，下面是更新的代码片段

               <ul id="nav" class="nav navbar-nav text-center">
                  <li> <a href="Index.php">Home</a> </li>
                  <li> <a href="#">About</a> </li>
                  <li> <a href="#">Rules</a> </li>
                  <li> <a href="#">Gallery</a> </li>
                  <li class="new">
                      <div class="fb-login-button" 
                            data-max-rows="1" 
                            data-size="medium" 
                            data-show-faces="false" 
                            data-scope="public_profile,email" 
                            vertical-align="middle" 
                            data-auto-logout-link="true" 
                            onlogin="checkLoginState()">
                        </div>
                    </li>
              </ul>

Answer 1

我已将您的文件存入我的本地环境并根据需要进行了一些修改。

截至目前，如果没有看到您的CSS代码，我可以提供如下解决方案：

在您已定义的ul中创建按钮的HTML代码。

按如下方式更改HTML代码：

<li class="new"><button class="facebook-login"> fb login</button><li>

然后提供相同的CSS：

.new {
float: left;
margin-top: 2%;}

希望这会对你有所帮助。

在bootstrap网页的导航栏中对齐facebook登录按钮

1 个答案: