search

code-hike / codehike

Marvellous code walkthroughs
https://codehike.org
MIT License
4.51k stars 140 forks source link

Wrong height on quirks mode #140

Closed pomber closed 2 years ago

pomber commented 2 years ago

If the html doesn't have <!doctype ... >, browser renders it in quirks mode, and some of the height: 100% styles act weird.

image

Here's a minimal html to test with and without <!doctype> and see the difference:

<!DOCTYPE html>
<html>
  <body>
    <div>
      <p>Lorem</p>
      <div class="ch-cg">
        <div class="ch-code" style="height: 100%; background: rgb(46, 52, 64)">
          Hello
        </div>
      </div>
      <p>Lorem</p>
    </div>
  </body>
</html>
pomber commented 2 years ago

Here's how the heigh: 100% works on quirk mode: The percentage height calculation quirk

github-actions[bot] commented 2 years ago

:rocket: Issue was released in v0.3.0 :rocket: