[Resolved] Line height for blockquote citation

[Tom]

Hello. I cannot seem to get my line height on my blockquote citations to change. They’re stuck at 1.5 and no matter what I change in the CSS, I can’t seem to change it. I’d like the line height to be 1.1. Here’s an example: https://tomnikkola.com/gyms-and-gymnastics-the-ideal-physical-fitness-combination/

Could you assist please?

[Leo]

Hi there,

Try this CSS:

.wp-block-quote p {
    line-height: 1.1em;
}

Adding CSS: https://docs.generatepress.com/article/adding-css/

Make sure to clear your caching plugin after.

Let me know if this helps 🙂

[Tom]

No, that doesn’t help. It changes the line height of the quote, which I don’t want, and doesn’t change the line height of the citation ( “cite”), which I do want.

[Leo]

Looks like you’ve already added the CSS that is working:
https://www.screencast.com/t/UozfZiWpS

Maybe try adding a unit like em?

[Tom]

That does not work…

[Leo]

What does not work exactly?

I’m seeing the exact same code on that page as my screenshot in the previous reply.

Make sure to clear the caching plugin if you’ve made changes.

[Tom]

I’m trying to get the citation – “Fundamental movement skills…” to a line height of 1.0 or 1.1. Nothing changes it. The quote can be modified through CSS, but the citation section cannot. In your screenshot, the line height is the same as it has been…

[Leo]

but the citation section cannot

This is incorrect. As mentioned above, the CSS you’ve added is already working. Here is a demonstration:
https://www.screencast.com/t/EcY91NHc

Please try a different value and add a unit as suggested in the previous reply.

Make sure to clear the caching plugin if you’ve made changes.

[Tom]

Ah, I see what you’re saying now. I’m sorry I wasn’t seeing what you were saying. In that case, how do I make it smaller? The line height appears to be about 1.5-2em. It just looks silly compared to the quote text line height and font size.

[Leo]

Hmm it doesn’t look like you can change the line-height of the <cite> element to be smaller than 1em.

I noticed the same the behaviour here:
https://developer.mozilla.org/en-US/docs/Web/HTML/Element/cite

[Tom]

Good to know. I’ll have to be aware of that with long citations. Sorry for the runaround. Thank you.

[Leo]

No problem!

You can always just use the headline block to replicate the appearance of the blockquote block:
https://docs.generateblocks.com/article/headline-overview/

You would lose the blockquote and cite markup but I don’t think it’s a big deal 🙂

[Author]

Posts