html {
        height: 100%;
      }
      body {
        box-sizing: border-box;
        display: flex;
        gap: 16px;
        height: 100%;
        margin: 0;
        padding: 16px;
      }
      #htmlcode {
        border: solid black 3px;
        box-sizing: border-box;
        font-family: Monospace, Monospace;
        font-size: 14px;
        height: 100%;
        line-height: normal;
        outline: none;
        resize: none;
        width: 50%;
      }
      #htmlpreview {
        border: solid black 1px;
        height: 100%;
        width: 50%;
      }
      @media (max-width: 1024px) {
        body {
          flex-direction: column-reverse;
        }
        #htmlcode {
          height: 50%;
          width: 100%;
        }
        #htmlpreview {
          height: 50%;
          width: 100%;
        }
      }