I have the css code below but it does not work on the post page:

( I am talking about font size and color )

/* gutenberg */
blockquote {
    text-align: center;
    margin: 20px;
    font-family: epicride;
    color: red;
    font-size: 90px;

wp-block-quote {
    font-size: 90px;

This is a page where it works:


This one is post where it does not work:


I have the css code below but font-family is not read.

@import url('https://fonts.googleapis.com/css?family=Love+Ya+Like+A+Sister&display=swap');

  figcaption {
    font-size: 30px;
    text-align: center;
    font-family: 'Love Ya Like A Sister', cursive;
      border-radius: 255px 15px 225px 15px/15px 225px 15px 255px;
      box-shadow: 20px 38px 34px -26px hsla(0,0%,0%,.2);
      border:solid 2px #41403E;
figcaption:hover {
    box-shadow: 2px 8px 4px -6px hsla(0, 0%, 0%, .3);

you can look at the same post page to check it out.

Also figcaption code affect my post plugin on homepage. How can I limit the code's control area with gutenberg element?

The home page: ( you will see black border on thumbnail )



1 Answer 1


enter image description here

Your blockquote has a <p> tag in it that overwrites the font-size attribute. Either delete the <p> tag or add css for bolckquote p or/and .wp-block-quote p

  • no, it reads sing single-post p so my code is over lined. Mar 27, 2020 at 21:36
  • I can see that you fond a workaround. H3 also works. As for the css problem i suggest that you google "CSS Specificity" and read about it. It helped me understand how it works.
    – matija
    Mar 30, 2020 at 6:05

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.