How can I centre align an item and right align an item within a HTML navigation bar whilst leaving the left empty?

Question

Hopefully this diagram better explains my goal:

This navigation bar is also responsive; the social glyphs collapse into hamburger menu. When this happens, I would like the title to remain centred, although I can probably do this myself.

Answer 1

I recommend you use bootstrap to have a better layout. for example for you, can use this:

  <div class="container">
    <nav class="row">
       <div class="col-lg-3">
         <div class="social-gylph">Twitter</div>
         <div class="social-gylph">Facebook</div>
       </div>
       <div class="col-lg-6">
         Website Title
       </div>
       <div class="col-lg-3">
       <!-- nothing at this moment -->
       </div>
    </nav>
   </div>

look more at: Bootstrap Layout