Headline h2 not neat between paragraphs

Hi there,
I’m working on a blogpost. Problem is, the headline between two paragraphs is not neat in the middle. In editor it looks good, but as soon as posted there is more padding above than underneath the h2. See screenshots.


As I’m in editor and not in Cornerstone I can’t use mtn. What do you suggest, please? Any chance of adjusting?

Thank you,
Karen

Hey Karen,

Applying mtn to your headlines won’t add the same space like in the WP visual editor. To achieve that, you would need to change the global top and bottom margins of the headlines. Please add this code in your Global CSS

h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
    margin: 0 0 1.313em;
}

Hope that helps.

Hey Christian,
that video is gorgeous, I’m really impressed… Thank you very much!
Now I’m trying to understand things precisely, so let me ask:

  1. Will this code apply to blog page only or will it change headline padding throughout the whole site?
    And 2. If it’s only h2 I’m using in blog page, can I shorten the code?
    That would make things clearer for me.
    Thank you :slight_smile:slight_smile: ren

Hi again,

1 & 2. The code provided above will be applied throughout the whole site, however if you need this to be applied to blog page or blog post only then you can use the shorten version of the code provided below:

.blog h2, .single-post h2 {
    margin: 0 0 1.313em !important;
}

Hope this helps!

Good morning Nabeel,
great, we’re getting there! Unfortunately double padding doesn’t quite look good on Blog page. So If you could tell me what to do so that this code applies to blog posts only, it would be perfect!

Thanks and cheers,
Karen

Hi Karen,

To make it affect only your blog page, kindly change the code to this.

.blog h2 {
    margin: 0 0 1.313em !important;
}

Thanks

Hi Paul,
tried it right away - sorry to say, it does affect the blog page, but what I meant was code for blog posts only. Misunderstanding I guess. Can you help?

Thanks, Karen

Hi Karen,

Sorry for misunderstanding.

To make it to affect blog posts only, you can change it to this.

.single-post h2 {
    margin: 0 0 1.313em !important;
}

Thanks

Thank you Paul, that worked - now all h2s are neat between bodycopy text. Great!
Have a nice day
Karen

You’re welcome! :slight_smile:

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.