Setting the Width of the Code Box (PrismJS): A Guide to Practical Tips

Question

So I'm basically trying to set a width for a code box (I'm using prismJS) and when I add too much code it causes everything to break and the width and height to increase. I want to be able to specify the width and height so if the code is too long it just adds a scrollbar.

This is the size I want the code box to be: Image

<div class="container">
    <div class="post-header">SOME HEADER</div>
  
    <div class="post-content">
  
      <p> <pre><code class="language-js">
        
      </code>

Answer 1

You need to add a CSS property to your code box

overflow: scroll;