Question: need apply in my index.html file this social media icons and menu icons in bootstrap

```html
    <ul class="social-media list-inline" align="right">
      <li><a href="#"><span class="fa fa-facebook"></span></a></li>
      <li><a href="#"><span class="fa fa-envelope"></span></a></li>
      <li><a href="#"><span class="fa fa-twitter"></span></a></li>
      <li><a href="#"><span class="fa fa-youtube"></span></a></li>
      <li><a href="#"><span class="fa fa-instagram"></span></a></li>
     </ul>
     <!--end social-->
     <a href="#fh5co-offcanvass" class="js-fh5co-nav-toggle fh5co-nav-toggle" data-toggle="collapse" data-target="#fh5co-navbar" aria-expanded="false" aria-controls="navbar"><span>Menu</span> <i></i></a>
```

I need In one line....

Answer: 
For Bootstrap 3:

```
<ul class="list-inline social-media">
  <li><a href="#"><span class="fa fa-facebook"></span></a></li>
  <li><a href="#"><span class="fa fa-envelope"></span></a></li>
  <li><a href="#"><span class="fa fa-twitter"></span></a></li>
  <li><a href="#"><span class="fa fa-youtube"></span></a></li>
  <li><a href="#"><span class="fa fa-instagram"></span></a></li>
</ul>

```

Ref: <http://getbootstrap.com/css/#inline>

If you are using bootstrap 4: 

```
<ul class="list-inline social-media">
  <li class="list-inline-item"><a href="#"><span class="fa fa-facebook"></span></a></li>
  <li class="list-inline-item"><a href="#"><span class="fa fa-envelope"></span></a></li>
  <li class="list-inline-item"><a href="#"><span class="fa fa-twitter"></span></a></li>
  <li class="list-inline-item"><a href="#"><span class="fa fa-youtube"></span></a></li>
  <li class="list-inline-item"><a href="#"><span class="fa fa-instagram"></span></a></li>
</ul>

```

Ref: <http://v4-alpha.getbootstrap.com/content/typography/#inline>

Just make sure that your `.social-media` class's style is not affecting it to appear as block.
Without Bootstrap. 

```css
ul.social-media li,ul{display:inline-block;padding:0px;}
```

```html
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet"/>
<ul class="social-media list-inline" align="right">
  <li><a href="#"><span class="fa fa-facebook"></span></a></li>
  <li><a href="#"><span class="fa fa-envelope"></span></a></li>
  <li><a href="#"><span class="fa fa-twitter"></span></a></li>
  <li><a href="#"><span class="fa fa-youtube"></span></a></li>
  <li><a href="#"><span class="fa fa-instagram"></span></a></li>
 </ul>
 <!--end social-->
 <a href="#fh5co-offcanvass" class="js-fh5co-nav-toggle fh5co-nav-toggle" data-toggle="collapse" data-target="#fh5co-navbar" aria-expanded="false" aria-controls="navbar"><span>Menu</span> <i></i></a>
```