以页脚为中心的bootstrap导航栏(bootstrap navbar centered in footer)

我想在div My Html代码中居中ul标签

<footer> <div class="wrap"> <ul class="nav navbar-nav social"> <li><a href="#">FB</a></li> <li><a href="#">Li</a></li> <li><a href="#">TW</a></li> <li><a href="#">You</a></li> </ul> </div> </footer>

和css

footer{ position: fixed; width: 100%; background: red; height: 70px; bottom: 0; z-index: 6; } footer .wrap{ margin: 10px auto; } .social{ width: 250px; }

我发布了我的实际情况的截图：

PS：我做了回应，对不起我的英语

I want to center ul tag in div My Html code

<footer> <div class="wrap"> <ul class="nav navbar-nav social"> <li><a href="#">FB</a></li> <li><a href="#">Li</a></li> <li><a href="#">TW</a></li> <li><a href="#">You</a></li> </ul> </div> </footer>

and the css

footer{ position: fixed; width: 100%; background: red; height: 70px; bottom: 0; z-index: 6; } footer .wrap{ margin: 10px auto; } .social{ width: 250px; }

I post screenshot of my actualy situation:

P.S: i do it responsive, and sorry for my english

最满意答案

在你的情况下你可以取消navbar-nav元素上的浮点数，然后用margin: 0 auto ：

.social { width: 250px; float: none; margin: 0 auto; }

演示： http ： //plnkr.co/edit/dmH6ySgEO5XnwXBbE7gt？p = preview

In your case you can cancel float on navbar-nav element and then center it with margin: 0 auto:

.social { width: 250px; float: none; margin: 0 auto; }

Demo: http://plnkr.co/edit/dmH6ySgEO5XnwXBbE7gt?p=preview

更多推荐