title: DIsplay block of codes on a web page
body: <p>I am currently building a website containing code snippets and wondered how StackOverflow does it. I try to recreate it many times, but no matter what I do, I just can't recreate it and I can't find anyone or anything that explains how to do it. Does anyone know how StackOverflow manages to create code snippets like this:</p>
  <pre><code>#include &lt;iostream&gt;
  
  int main(){
      std::cout &lt;&lt; &quot;Hello World!&quot; &lt;&lt; std::endl;
      return 0;
  }
  </code></pre>
  <p>I know that it uses <code>&lt;pre&gt;</code> and <code>&lt;code&gt;</code> but even knowing that I can't find an explanation of what I need to do to recreate it. Can someone help me to find a way to recreate this code snippet style please?</p>