CSS centring of logo in header

Question

I am struggling to get the header logo on http://inksharks.com centered in most desktop browsers. It does center when scaled to a mobile or tablet view. I have tried several things this was the closest I got to fixing it but it altered my footer as well.

.wrap-inner .twelve.pane {
    margin-left: 0 !important;
    width: 930px;
}

Answer 1

On .logo, h1.logo remove float: left;. Then on .logo img, .logo .text-logo, .logo .description put

CSS:

.logo img, .logo .text-logo, .logo .description{
      display: block;
      margin: 0 auto;
}

Answer 2

<h1 class="logo img-only">

</h1>

add an align attribute to this, and it will look like

<h1 class="logo img-only" align="center">

</h1>

It will work fine

Answer 3

This will center align your logo:

h1.logo {
    float: none;
}
div.wrap-inner {
    text-align: center;
}

I am overriding the float: left on your h1.logo, it's better to remove it though if you can.

Also remove padding-top:44px from .nav-right .navigation-wrap to fix the space between the logo and your content.