0

I am working with a pre-existing theme. On the site in question, the style sets rules for P tags. These rules are applied in preference to the class styles for P tags used in certain blocks. (With the result that covers, for example, look quite silly). How can I fix this?

4
  • What do you mean covers? can you share your URL so we can see what is "silly" and what should you do. Jul 7, 2019 at 2:00
  • Covers are a built-in block type. By silly, I mean that style.css defines p as something like 12pt which makes .has_huge_font_size overridden. Jul 7, 2019 at 6:59
  • 1
    There's nothing special about Gutenberg here, your CSS just needs to use Specificity appropriately. Jul 11, 2019 at 12:29
  • Is there some way I can restate the block CSS, queue it last, or make it all !important? The theme is nice but it does not play well with the new block approached. Aug 4, 2019 at 1:17

1 Answer 1

1

Many of the default blocks add a class wp-block-[name] to the block's root element on save. You could use these to increase your class specificity.

For your example of covers, .wp-block-cover .has-huge-font-size or .wp-block-cover p.has-huge-font-size depending on how much specificity you need.

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.