[FriechModerator]

Hi There,

Your custom css should do the trick (I’ve test it on my local dev). Here’s a shorthand version of that.

.x-blockquote,
.x-blockquote .x-cite {
	font-family: Lato, sans-serif;
	font-size: .98em !important;
	line-height: 1;
}

You can place that under @media (max-width: 767px) or @media (max-width: 480px) block.

If that did not work, please point us to your blockquote element and we’ll inspect it why the code is not working.

On other note, please refrain from using the !important declaration unless it is necessary.

Thanks.

[NaturalifeParticipant]

Thank you for the suggestion. Unfortunately, I had no luck with this change.

The block quote I am having issues with is on this page: http://naturalife.org/nutrition/signs-of-a-magnesium-deficiency

Its under “3. Anxiety” header.

If the !important is not required I will remove it.

Thanks!

[JadeModerator]

Hi there,

Please try this CSS:

@media (max-width: 767px) {
    blockquote p {
        font-family: Lato, sans-serif;
	font-size: .98em !important;
	line-height: 1;
    }
}

Hope this helps.

[NaturalifeParticipant]

That didn’t seem to work either unfortunately.

Thanks for the suggestion though!

Any other suggestions as to how I can make the mobile changes?

[FriechModerator]

Hi There,

Oh I see, I’m sorry I overlook that. The blockquote you have is not the blockquote element of Cornerstone. It’s a plain <blockquote> tag. Please update my code to:

blockquote {
	font-family: Lato, sans-serif;
	font-size: 0.98em;
	font-style: italic;
	line-height: 1;
}

Hope it helps, Cheers!

[Author]

Posts