Home>Support>White Space Header

White Space Header

By Oliver Saintilien, 10 years ago. Last reply by Andrew Misplon, 10 years ago.
Notice: This thread is over two years old; the information may be outdated. Please consider creating a new thread if you require free support. If you have an active SiteOrigin Premium license, you can email our premium support desk at [email protected].

I have looked through the forum and tried the suggestions made but I still have the white space on the right side of my header.

This is the solution that I found in another post and tried my self I pasted this in the custom CSS

 /* Full header logo */

header#masthead {
padding: 0 !important;
}

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

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

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

body.responsive header#masthead hgroup .support-text, body.responsive header#masthead hgroup #header-sidebar {
display: none !important;
}

But as you can see there is a white gap on the right side of the header.

URL: http://www.primitivecreations.tv/

This is our free support forum. Replies can take several days. If you need fast email support, please purchase a SiteOrigin Premium license.

  1. 10 years, 3 months ago wpinster

    Hi Oliver,

    I just had a check on your site.

    I see the width of your image is 1010.

    I changed this to 1080 and the white area was covered.

    img width=”1080″ height=”140″ alt=”Primitive Creations Logo” src=”http://www.primitivecreations.tv/wp-content/uploads/2015/04/Banner.jpg”

    I’m only starting off myself, but I think this should resolve your problem (if i’ve understood your issue).

    Thanks.
    Kiran

  2. 10 years, 3 months ago Oliver Saintilien

    Thanks for the response, I”m not to tech savy could you please explain what I must to in detail? Am I suppose to put that code somehwhere? , if so where should I put it?

  3. 10 years, 3 months ago wpinster

    Hi Oliver, no problem. I’ll do my best to explain.

    1. Log into your WP-Admin dashboard.
    2. Open your home page for edit
    3. You’ll see a ‘VISUAL’ and “TEXT’ tab above the editor. Click the TEXT tab
    4. Scroll down to find the following:
    img width=”1010″ height=”140″ alt=”Primitive Creations Logo”
    5. Change the width text from “1010” to “1080”
    6. Save the page.

    I think that should do it.

  4. 10 years, 3 months ago Oliver Saintilien

    Thanks For the Helping out however, when I look at the text editer for my home page I do not see that code.
    The way I got the banner there was by using the upload logo button seen here

    http://s12.postimg.org/tjy5iscl9/screenshot_8.png

    I put it in Logo Image.
    But no matter what I do whether the settings are set to full width or boxed the white gap is still there :/. I tried a lot of things but seeing that I ‘m not to code savy I’m kind just clicking buttons. All I want is my header to have no white gaps whether in boxed layout mode or full width layout mode.

  5. 10 years, 3 months ago Andrew Misplon
    Hi, I Work Here

    Hi Oliver

    Please could you try replacing the existing Custom CSS for this with the following:

    /* Full header logo */

header#masthead {
padding: 0 !important;
}

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

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

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

body.responsive header#masthead .hgroup .support-text, body.responsive header#masthead .hgroup #header-sidebar {
display: none !important;
}

    Let me know how that goes. Thanks :)

  6. 10 years, 3 months ago Oliver Saintilien

    Thanks it Works!!!
    Do you know why the code I was using didn’t work? I’d like to understand what happened.

    I also made some other posts in regards to this they can be disregarded.

  7. 10 years, 3 months ago Daniel
    Hi, I Work Here

    Hi Oliver

    Am glad that did thee trick. This is because you were using:

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

    Instead of this

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

    Cheers

  8. 10 years, 3 months ago Andrew Misplon
    Hi, I Work Here

    Sorry Oliver that’s my fault. At some point I used max-width: 1080px for a client. In this situation we needed:

    height: auto;
    width: 1080px;

    Glad to hear you’re back on track.

    All the best.

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