🔍 원인 요약 (이 화면의 핵심)
서브픽셀 렌더링 + 배율/가속 문제입니다.
정확히는:
- 100%가 아닌 디스플레이/브라우저 배율
- 하드웨어 가속
- 1px border가 소수점 좌표에 걸릴 때 발생
티스토리 관리자, 애드센스 화면에서 아주 흔한 증상이에요.
✅ 가장 효과 좋은 해결 순서 (위에서부터 꼭 해보세요)
1️⃣ 브라우저 배율을 정확히 100%로
Ctrl + 0
👉 90%, 110% 상태면 1px 라인이 거의 반드시 깨집니다.
2️⃣ 윈도우 디스플레이 배율 확인
설정 → 디스플레이 → 배율
- 가능하면 100%
- 125% 사용 중이면 → 이 현상 매우 잘 생김
💡 125% + 크롬 조합 = 라인 깨짐 조합입니다.
3️⃣ 크롬 하드웨어 가속 끄기 (가장 중요)
이 증상엔 이게 거의 결정타예요.
크롬
- 설정
- 시스템
- 「가능한 경우 하드웨어 가속 사용」 끄기
- 크롬 완전 종료 후 재실행
👉 끊긴 라인이 바로 정상으로 붙는 경우 정말 많아요.
4️⃣ 확대/축소 상태에서 캡처했는지 확인
지금 올려주신 이미지도:
- 캡처 당시 배율 ≠ 100% 가능성 높아요
📌 캡처 전 체크:
- 브라우저 100%
- 윈도우 배율 고정
- 스크롤 멈춘 상태에서 캡처
5️⃣ (보너스) 엣지로 열어보기
같은 화면을 Edge에서 열면:
- 멀쩡하게 보이면 → 크롬 렌더링 문제 확정
❗ 이건 정상 오류에 가까워요
중요한 포인트 하나 말씀드리면:
- 사이트가 잘못된 게 ❌
- 이미지가 손상된 게 ❌
- 모니터 고장 ❌
👉 GPU가 1px 선을 소수점 좌표로 그리면서 생기는 현상이라
개발자·블로거들 다 한 번씩 겪습니다.
✍️ 블로그 운영 관점에서 팁 하나
글에 이런 관리자 화면 캡처 올릴 때는:
- PNG
- 가로선 많은 화면은 배율 100%에서만 캡처
- 크롬에서 깨지면 → 엣지로 캡처
이렇게 하면 독자 눈에도 훨씬 깔끔해요.
원하시면
👉 “캡처용 최적 세팅(배율·브라우저·해상도)”
👉 “라인 안 깨지는 CSS 캡처 요령”
같은 것도 정리해 드릴게요.
지금 상황, 충분히 이해합니다.
반응형