Need to get rid of white space


  • Author
  • #3583



    I’ve tried a couple of the codes in the forum that have been provided but i can’t seem to get rid of the white space between my main menu and first image and then then the white space between the “copyright…” and the “contact us” sections. I’ve included screenshots of what i want gone.

    My website is


    screenshot 2



    My mobile seems to have quite a bit of work that needs to be done with padding and stuff. A few of the buttons are right on the bottom, what’s the CSS code to get a little space with the buttons. I’ve included screenshots so you can see what I’m talking about.

    Is there also a way to make it on mobile so it goes picture, then text on my home page?

    My menu doesn’t seem to be formatting properly as well.

    And on my contact page, how do I make the words wrap instead of having the hyphen?

    Sorry for all the questions, I’m launching my website here in the next week and just want to make sure everything is perfect.


    Andrew Misplon

    Hi 🙂

    Thanks for posting your questions. We’ll be introducing top and bottom page margins as a page setting in the next update. For the moment we can use Custom CSS to remove these.

    Contact Page
    If you change the Page Template from Default to Full Width - No Page Title the following Custom CSS should work:

    /* Contact */
    .page-id-277 .site-content {
    	padding-top: 0;

    In Custom CSS you have one rule for the home page, please change it to:

    /* Home */
    .home.siteorigin-panels-home .site-content, .page-template-home-panels .site-content {
    	padding-top: 0;
    	padding-bottom: 0;

    Consider removing the following from Custom CSS to get spacing below the contact page form button:

    /* Page Bottom Padding */
    .page:not(.home) .site-content {
    	padding-bottom: 0;	

    We can always make other adjustments if this changes other page, I can’t see that it will.


    Andrew Misplon

    Mobile Toggle Fix

    /* Mobile Menu */
    .responsive-menu .menu-toggle {
        margin-top: 11px;

    Collapse Order
    Edit the Page Builder rows in question by clicking the wrench icon far right. Open the Layout section on the right and locate the Collapse Order drop-down menu. Try using Right on Top.



    Thank you that helped. There are still a few things I need to fix. Now on the mobile site my second picture with the man standing on a hill seems to have a grey spot and i don’t know where that came from. Can we get rid of this?

    And with my pages, I hid the title, but there’s still a gray bar where the title of the page used to be. How do we get rid of this?

    The words are still being hyphenated on my contact form and they are not wrapping so it still looks like “com-
    unity” and “in-
    volved” I’d want bot of those words to be wrapped so it just reads community and involved.

    Thanks for your help!


    Andrew Misplon

    Glad that helped a bit. I’ll back online tomorrow (GMT+2) to assist further, I’m sure we can resolve. Thanks for the wait.


    Andrew Misplon

    Grey Bar
    I’m unable to replicate the grey bar in iOS Chrome or Safari (iPhone 6s). I’ve also tried to replicate in the OS X Chrome simulator using iPhone 5 and 6. Can you try refreshing a few times, is it still there?

    Page Titles
    Please, consider changing pages like this from the Default page template to the Full Width – No Title page template. That will achieve what you’re after. The page template drop-down menu is in the right column Attributes meta box when editing any page, the drop-down is labelled Template.


    Contact Page
    Please, try:

    /* Headings */
    h6 {
    	-moz-hyphens: none;
      	-ms-hyphens: none;
      	-webkit-hyphens: none;
      	hyphens: none;


    For the contact page, it still wraps in mobile.

    Also, how do you change the image in a navigation bar on Chrome.


    Andrew Misplon

    Favicon (Site Icon)

    Adding a Favicon

    I’m unable to replicate any heading hyphenation in iOS using Chrome or Safari (iPhone 6s). Chrome’s simulator for iPhone 5 also isn’t showing any.



    Is there any way to make the site load faster on mobile?


    Andrew Misplon

    Go to Plugins and check the list. Are you using every plugin? For example, if you aren’t using Livemesh, or Awesome Widgets For SiteOrigin Page Builder, disable those plugins. Disable every plugin you aren’t using.

    I assisted a user recently in getting W3 Total Cache to assist with mobile caching. Here is the tutorial I used to set that up: Where the author highlights Theme: Clear Retina, you’ll select Ultra.

Viewing 11 posts - 1 through 11 (of 11 total)

You must be logged in to reply to this topic.

Scroll to top