Home>Support>How do I align the logo image all the way to the left
  1. 9 years, 8 months ago Andrew Misplon
    Hi, I Work Here

    Hi David

    The header, body and footer are all constrained to 1080px. Try inserting the following under Appearance > Custom CSS to remove the constraint on the header:

    /* Vantage 100% width header */body.responsive.layout-full #page-wrapper .hgroup.full-container { max-width: 100%; }
  2. 9 years, 8 months ago David Beaulieu

    Andrew,

    Thanks for the suggestion. I tried it and nothing happened. I am using a child theme, however, the Custom CSS should work for both the child and parent, I believe.

  3. 9 years, 8 months ago David Beaulieu

    Andrew,

    I think I got it! I found another post that had the correct answer. It’s the last post. – Thread: How To Remove Left and Right White Space Around Logo? (Vantage Premium)

  4. 9 years, 8 months ago David Beaulieu

    Sooo, It did break a few things so if you have any other suggestions let me know. Such as the header text no longer shows up where it is supposed to. I also noticed it didn’t keep the height as it basically stretched the image to the 1080px.

    I added this to the original code and it fixed the height issue:

    header#masthead .hgroup .logo img {
width: 1080px;
height: auto;
}
  5. 9 years, 8 months ago Andrew Misplon
    Hi, I Work Here

    Ahh right, you’re running the Vantage boxed layout. I’d recommend removing all the CSS you added and try the following:

    header#masthead .hgroup .logo {
margin-left: -35px;
}
  6. 9 years, 8 months ago David Beaulieu

    That worked and left aligned the logo but my logo is 1080px wide which should allow it enough room to fill the entire 1080px width of the theme. However, on the right side it now is not filling about 35px with the logo and instead it is the background color of black. The header text shows up but I really need the logo to go across the entire page wrapper of 1080px.

    Sorry I should have given you more info!

  7. 9 years, 8 months ago Andrew Misplon
    Hi, I Work Here

    No problem.

    Remove all the Custom CSS you’ve added in this regard and add the following:

    /* Full header logo */

header#masthead {
padding: 0 !important;
}

header#masthead .hgroup {
padding: 0 !important;
}

header#masthead .hgroup .logo img {
width: 1080px;
}

.main-navigation {
margin: 0 !important;
}

body.responsive header#masthead .hgroup .support-text, body.responsive header#masthead .hgroup #header-sidebar {
display: none !important;
}
Replies on this thread are closed. Please create a new thread if you have a question, or purchase a SiteOrigin Premium license if you need one-on-one email support.

Get The Most Out of SiteOrigin with SiteOrigin Premium

Find Out More