전체 화면 HTML 다이얼로그 모달 디버깅

저자는 사이드 패널을 만들기 위해 HTML의 `` 요소를 사용하는 중에 높이 문제를 발견했습니다. 하단에 빈 공간이 생겨 전체 화면 높이를 차지하지 못했습니다. 디버깅 과정에는 Claude나 ChatGPT와 같은 AI 툴에 문의하는 등 다양한 방법이 포함되었습니다. 문제의 원인은 `` 요소에 적용된 Chrome의 기본 스타일 `max-height: calc(100% - 2em - 6px);`였습니다. `max-height: inherit` 또는 `max-height: 100vh`를 추가하여 문제를 해결했습니다. HTML 사양을 자세히 조사한 결과 이 기본 스타일은 이전 버그를 수정하기 위해 추가되었다는 것을 알게 되었고, 이는 웹 표준의 끊임없는 진화를 강조합니다.