Lisa
(@workingwebsites)
It looks like a css padding issue.
I assume you’re talking about the white space on top between the image and content of the page
http://graphicainc.co.za/services/
(gap between image and Signage ‘Solutions’ ‘Printing Solutions’ ‘Branding’)
That’s a padding between the content and the top.
That’s set in the style sheet, line 1022 by the looks of it.
.page-wrap {
padding: 83px 0 100px;
clear: both;
}`
Note the padding for the bottom is ‘100px’
If you change that number, it will shrink the gap.
If you can’t get into that css code, try re-defining it.
Ex.
.page-wrap {
padding: 83px 0 20px;
clear: both;
}
If that doesn’t work, try insisting on the change by using !important
Ex.
.page-wrap {
padding: 83px 0 20px !important;
clear: both;
}
What code did you try? This code should close up that gap:
.page-wrap {
padding-top: 10px;
}
Don’t edit your theme’s files directly, as you’ll lose those changes if the theme is ever updated in the future, to fix bugs or security issues or to add new features. Instead, you should use the custom CSS plugin, as you were already advised to.
Hi workingwebsites. Im using a Custom CSS manager plugin. Im not editing the theme CSS as i don’t want to loose the changes when the theme updates
Hi Stephen. I placed that code into my Custom CSS manager and it seems to have descreased the gap but not completely. Is there something els i need to do to make all the white disappear?
See link below
http://graphicainc.co.za/graphic-design/
It looks like whatever plugin you used to hide the page title didn’t hide the entire page header area, so you’ve still got some leftover space. You could try hiding the entire page header:
.entry-header {
display: none;
}
I tried that and its still there.
Should I deactivate the “Hide Header ” Plugin?
Oops, I forgot some other CSS. My fault. Try this, too:
.page .page-wrap .content-wrapper, .single .page-wrap .content-wrapper {
padding: 0;
}
Lisa
(@workingwebsites)
The problem is above the header, so no need to de-activate the plug in.
What’s happening is there is padding on the container with the header and the content in it.
Try updating your CSS as below:
.page .page-wrap .content-wrapper,
.single .page-wrap .content-wrapper {
padding: 30px;
padding-top: 0;
}
That gets rid of the white gap.
On your page: http://graphicainc.co.za/graphic-design/
you may find the content is too close to the top. You may want to move that down a little.
Try:
.no-col-padding .panel-grid-cell {
padding-left: 0 !important;
padding-right: 0 !important;
padding-top: 30px;
}
A white gap on the other pages are less of an issue because the background is white too.
