Markdown code not showing properly

Description

The <code> CSS on the page causes problems in design on large and small screens - for example, check out this screenshot:

...and this video on mobile (causes unwanted escaping of the layout horizontally and unexpected left-right scrolling):

https://youtu.be/S-sOQPcsPtQ

@karlhorky has suggested the following CSS changes to improve this design, inspired by GitHub's CSS for <code> elements:

code { font-size: 0.9em; padding: 0.15em 0.3em; border-radius: 6px; max-width: 100%; }
a code { color: var(--wp--preset--color--brand-links); text-decoration: underline; }

I added as a custom CSS for now, and would appreciate it if you could add it as a permanent fix.

Steps to reproduce

No response

What you expected to happen

No response

What actually happened

No response

Inspectez la feuille de style ou le CSS du thème où sont stylisés les éléments de code de la page, puis reproduisez la mise en page sur les grands et les petits écrans à l’aide de la capture d’écran et de la vidéo liées. Appliquez le style de code suggéré et vérifiez que le code en ligne tient dans le viewport sans provoquer de défilement horizontal indésirable.