Hi, I’m using WP 4.5.3 with the latest sketch theme 1.2.2. I have an issue with the header jumping when I switch pages. My front page is a portfolio page and it looks like the header sits higher then the other pages. The other pages are full width and blog post pages If I switch it to a full width page the headers are perfectly aligned. Any help would be so very appreciated, thanks.
javidiaz.dreamhosters.com
Hi @jdiaz110,
You’re right! I’m going to have a look into why the spacing around the menu is a little different to other pages but, in the meantime, you can patch the issue with some custom CSS.
As you already have Jetpack installed, a straightforward way to add CSS is to activate its custom CSS module. From there navigate to Appearance > Edit CSS.
(Alternatively, you can set up a child theme or activate a standalone CSS plugin.)
Enter the following snippet in the custom CSS editor:
.page-template-portfolio-page-php .site-header {
margin-bottom: inherit;
}
Let me know how you get on with that or if you have any extra questions!
Siobhan,
Thank you for responding and posting a solution. This did the job. I’m not very familiar with CSS yet, but the snippet of code is inheriting from the the main page of the sketch theme? is that correct?
Regards
Javi
Hi Javi,
I’m glad that did the job!
You’re right that the CSS I provided forces the portfolio page to inherit the spacing used on all others pages of the theme.
If you’re curious about how I found the needed CSS: I used my browser’s built in tools to inspect the theme’s existing CSS and experiment with the specific CSS for your needs. We have guidance on how you could use your browser’s tool in a similar way here:
https://en.support.wordpress.com/custom-design/how-to-find-your-themes-css/
We also have a good introduction to CSS and links to other introductory resources here:
https://en.support.wordpress.com/custom-design/css-basics
If you’re interesting in learning CSS or customising Sketch further, I’d be happy to help with any questions that come up.
