title: <ul> within <ol><li> still showing numbers
body: <p>My personal website using a school template is behaving very weirdly. I tried to nest a ul within an ol. The parent ol numbers still show up in front of the ul item dots. For example, I typed</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;ol&gt;
    &lt;li&gt;a&lt;/li&gt;
    &lt;li&gt;b
      &lt;ul&gt;
        &lt;li&gt;b1&lt;/li&gt;
      &lt;/ul&gt;
    &lt;/li&gt;
  &lt;/ol&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p>to expect</p>
  
  <ol>
  <li>a</li>
  <li>b<ul><li>b1</li></ul></li>
  </ol>
  
  <p>What I get instead looks like this:</p>
  
  <p><a href="https://i.stack.imgur.com/vjCJs.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/vjCJs.png" alt="enter image description here"></a></p>
  
  <p>It is as if nesting is not allowed. Once I disable styles the list displays properly. What command in CSS could have caused this?</p>