Проблемы На Inlining выпадающего меню на XS Отображения

Question

Вы можете, пожалуйста, взгляните на This Demo и дайте мне знать, как я могу изменить стиль списка выпадающего на list-inline только на Xs дисплеях:

прямо сейчас, что стандарт бутстрапу обеспечивая, как это:

Но мне нужно displat их в одну линию, как

вы можете сообщить мне, как это сделать только на дисплее телефона (xs)?

Благодаря

Answer 1

Дают пункты списка класс как .social-icon

<li class="social-icon"><a href="#"><i class="fa fa-facebook"></i></a></li> 
<li class="social-icon"><a href="#"><i class="fa fa-linkedin"></i></a></li> 
<li class="social-icon"><a href="#"><i class="fa fa-twitter"></i></a></li> 

Затем сделайте их и якоря внутри inline-block

.navbar-nav .social-icon, 
.navbar-nav .social-icon > a { 
    display: inline-block; 
} 

DEMO