[Resolved] Blog page header, padding

[Anika Paape]

Hello,

quick question about the Blog page header add-on:

When I alter the “Top/Bottom Padding” nothing happens. I would like to no space between header and navigation but when I enter “0” for the padding nothing happens. Actually nothing happens when I put in any other number.

Why might that be?

Thanks in advance.

[Tom]

Hi there,

What version of Page Header/GP Premium are you using?

You can check in the “Plugins” area.

[Anika Paape]

Hi Tom,

it’s Version 1.3.3.

cheers

[Tom]

The latest version of Page Header is 1.3.34.

Can you try updating to that version and see if it fixes it?

[Jaakko Pöntinen]

Following up on this:

How to add padding left/right of the header image?

Also (a more general css-noob question): How do i find out the name of containers of web content? So that i could use Simple CSS to modify whatever i see. Don’t know if it works like this but…

Cheers,
– Jaakko Pöntinen

[Tom]

Hi there,

Just a regular page header image or page header content as well?

Use the “Inspect Element” tool in your browser (Chrome – right click “Inspect”, Firefox use Firebug extension).

These tools will show you the container classes which you can use when writing your CSS.

[Jaakko Pöntinen]

Hey,

Thanks for the inspector tip – this is awesome! Now I have the POWER! BWHAHAHA none can hide!

And about the header: I need content padding (I think). I have padded the content container on my Generatepress-theme blog and I used the “Blog Page Header” Plugin to have the header to act as a link for the front page. Now I have to match the header’s padding to that of the blog’s content container (set in the customizer).

EDIT: I may have the power but I’m still stuck.
This is what firebug tells me (edited some info out):

Which tells me what? What should i pad with Simple CSS? So many identifiers and classes and variables and thingamajiggies and doodaas.

Cheers and thanks for the help, bear with me!
– Jaakko Pöntinen

• This reply was modified 8 years, 3 months ago by Jaakko Pöntinen.

[Jaakko Pöntinen]

Umm, i messed up in my last post. And I can’t seem to edit it anymore.

I was saying, Firebug shows me this:

<div class="page-header-image grid-container grid-parent generate-page-header">
<a href="http://xxxx:#####/">
<img class="attachment-full size-full" width="1100" height="180" sizes="(max-width: 1100px) 100vw, 1100px" srcset="http://xxxx:#####/wp-content/uploads/2016/01/testheader11-300x49.jpg 300w, http://xxxx:#####/wp-content/uploads/2016/01/testheader11-768x126.jpg 768w, http://xxxx:#####/wp-content/uploads/2016/01/testheader11-1024x168.jpg 1024w, http://xxxx:#####/wp-content/uploads/2016/01/testheader11.jpg 1100w" itemprop="image" alt="abcbacbabcbac" src="http://xxxx:#####/wp-content/uploads/2016/01/testheader11.jpg">

How do i know what to write with Simple CSS to add padding, there’s so much stuff there and nothing seems apparent to me. I thought there’d be like a div identifier…?

Thanks,
– Jaakko Pöntinen

• This reply was modified 8 years, 3 months ago by Jaakko Pöntinen.

[Tom]

You should do this:

.page-header-image {
    padding: 20px;
}

[Michiel]

Hi Tom,

I am a newby so I tried to find the answer in the knowledgebase but was not successful.

The Headings (H1, H2 …) seem to have a default minimum padding/margin so white space is created at the bottom which cannot be adjusted in the typography. You can make it larger but not smaller.
I would very much like to have the headings just above my paragraphs with the same line height as the lines in the paragraphs. Is there an option to remove this minimum default setting of this white space?

Thanks,

Michael

[Tom]

Hi Michael,

You can adjust the margin of the headings site-wide with this CSS:

h1, h2, h3 {
    margin-bottom: 15px;
}

Or individually by adding the style to them:

<h1 style="margin-bottom:15px;">My heading</h1>

[Michiel]

Hi Tom. thx.
It worked.
In the meantime I got quite a bit of experience with CSS alterations!

[Tom]

Awesome! Glad I could help 🙂

[Author]

Posts