Search code examples
csswordpresstags

How to add additional CSS to <code></code> tag?


I would be very grateful if someone could help me please.

I got to add an additional CSS code to the "code blocks", with the below code:

pre.wp-block-code {
border-left: 9px solid #F26C4F;
background-color: #1B325F !important;
padding: 15px;

But, I I need to edit also that tags, i.e., for the inline code.

Let's say I am writing a paragraph and need to insert a piece of code inside of it, as for example "top command", when the top would have to be inserted between and . So only the word "top" would be "printed" differently (with a custom background, for example).

How to achieve this, please?

Thanks in advance.


Solution

  • By using the tags as selector, alternatively using p in addition.

    Something like

    p code {
      background: gray;
      border-radius: 2px;
      padding: 0.15em 0.35em;
      white-space: normal;
    }