https://kukie.tech/tags/blog/Recent content in Blog on HistoryHugoko-krWed, 04 Mar 2026 18:00:00 +0900https://kukie.tech/posts/card-layout-refactor/Wed, 04 Mar 2026 18:00:00 +0900https://kukie.tech/posts/card-layout-refactor/<p>맥에서 멀쩡하던 카드 레이아웃이 윈도우 모니터에서 너무 크게 보이는 문제를 고치면서 구조 자체를 뜯어고친 과정을 정리함.</p> <h2 id="문제-모니터마다-카드-크기가-달라짐">문제: 모니터마다 카드 크기가 달라짐</h2> <p>맥에서 볼 때는 카드 높이가 적당했는데, 윈도우 모니터로 보니 카드가 너무 커졌음. 원인은 카드 높이를 <code>65vh</code>로 잡아놨기 때문이었음. <code>vh</code>는 뷰포트 높이 기준이라 모니터가 크면 그냥 비례해서 커짐.</p> <p>가로폭도 마찬가지였음. 그리드 컨테이너를 <code>max-width: 90vw</code>로 잡아놨는데, 27인치 모니터에서는 <code>90vw</code>가 엄청 넓어짐.</p> <h2 id="카드-높이-고정-시도">카드 높이 고정 시도</h2> <p>처음엔 <code>vh</code>를 픽셀로 바꾸는 것만 해봤음.</p>https://kukie.tech/posts/blog-setup-journey/Wed, 04 Mar 2026 12:00:00 +0900https://kukie.tech/posts/blog-setup-journey/<p>Hugo + GitHub Pages로 블로그를 세팅하면서 겪은 문제들을 정리함.</p> <h2 id="css가-아예-안-먹히는-문제">CSS가 아예 안 먹히는 문제</h2> <p>처음 배포했을 때 스타일이 전혀 적용되지 않았음. Chrome 개발자도구를 열어보니 이런 에러가 있었음.</p> <pre tabindex="0"><code>Failed to find a valid digest in the &#39;integrity&#39; attribute for resource &#39;stylesheet.css&#39; with computed SHA-256 integrity &#39;...&#39;. The resource has been blocked. </code></pre><p><strong>SRI(Subresource Integrity)</strong> 해시 불일치 문제였음.</p> <p>Hugo는 빌드할 때 CSS 파일의 SHA-256 해시를 계산해서 HTML의 <code>integrity</code> 속성에 자동으로 박아줌. 브라우저는 이 값을 실제 파일이랑 대조해서 위변조 여부를 검증하는데, 값이 다르면 보안상의 이유로 파일 로드를 차단함.</p>