Centering image in wordpress theme css

Question

This is how header looks already:

HTML

<div class="row">

  <div class="col-md-6 col-sm-8 col-xs-12 text-right">
    <a href="#"><img class="site-logo" src="logo.png" alt=""></a>
  </div>
  <div class="col-md-6 col-sm-4 col-xs-12">
    <nav>...</nav>
  </div>

</div>

with default css

I want to have logo centered in the whole row (in the middle of screen) but without changing nav at all.

Answer 1

On md sceen it would be imposible since you have col-md-6 on both divs, so each colum takes a half of the screen,on the other sm and xs screens you can achieve this doing the following Change this line:

  <div class="col-md-6 col-sm-8 col-xs-12 text-right">

To

  <div class="col-md-6 col-sm-4 col-sm-offset-4 col-xs-12 text-center">

Hope it could help.