전체 글257

Article Thumbnail

구글 Chrome 텍스트 크기 렌더링 오류

모바일 기기(안드로이드)의 구글 Chrome 브라우저에서 텍스트 렌더링 결과가 font-size 지정과 무관한 오류 현상을 보이고 있습니다. 동일 페이지의 상단과 하단의 폰트 크기가 다르게 나타납니다. [추가] 2024.12.17오류 발생하지 않고 정상 출력* 모바일 Chrome 버전 131.0,6778.260에는 아래와 같은 텍스트 관련 옵션들이 있습니다.1. 방문하는 사이트의 텍스트 및 이미지 확대 또는 축소가 가능한 "기본 확대/축소" 기능2. 웹사이트의 확대 방지 요청을 무시하는 "확대/축소 강제 사용" 선택 기능이 2개의 옵션은 모바일 기기 자체의 설정 기능인 "글자 크기와 스타일" 및 "화면 크게/작게"와 함께 사용할 경우 여전히 오류 발생 가능합니다. 데스크탑의 디스플레이 크기와 달리 모바일..

2024. 9. 5. 댓글
Article Thumbnail

google adsense 광고에 적용하는 inline CSS code 예제

Google Adsense Help / Ad units의 다음 페이지 참고"How to modify your responsive ad code"다음 작업은 html 파일에 관련 코드를 추가하는 요령입니다. 티스토리 배포 스킨에서는 'skin.html' 파일을 수정합니다. 1. 애드센스 개별 광고(display ad unit) 페이지에서 제공하는 코드를 위한 클래스를 지정합니다. 아래 예문에서는 "ads_aside" 클래스를 추가하였습니다. 블로그 사이드바에 부착하는 광고라서 위치 확인이 편한 이름을 사용하였습니다.  2. 위에서 지정한 클래스를 위한 CSS style 코드를 추가합니다.  ※ 애드센스에서 제공하는 개별 광고의 기본 코드에 지정한 style 항목과 충돌하지 않게 조심합니다.

2024. 8. 27. 댓글
Article Thumbnail

바나나 보관 방법

바나나 구입 후 10일 정도의 기간 동안 갈변하지 않고 먹을 수 있는 방법입니다. 개인적으로 여러 가지 보관 방법을 실험하면서 얻어낸 간단한 요령입니다. 인터넷 검색으로 찾은 방법을 적용하면서 잘못된 부분을 개선하고 수정하였으며, 작년부터 이 보관 방법을 이용하여 최장 2주 정도까지 보관이 가능하였습니다. 갈변이나 과숙성 현상 거의 발생하지 않습니다. 주거 환경이 다른 이유로 인하여 기재한 내용과 다른 결과가 나올 수도 있습니다. 준비물: 바나나, 식초, 지퍼백(식품 포장 비닐) 1. 구입한 바나나의 겉 포장지(비닐)를 제거합니다.  2. 포장을 제거한 바나나 덩어리를 한 개씩 분리합니다. 가장자리부터 한 개씩 손으로 뜯어냅니다.  3. 낱개로 분리한 바나나의 꼭지를 1Cm 정도 남기고 잘라 줍니다. 주..

2024. 6. 11. 댓글
Article Thumbnail

DISM 명령어로 Windows 이미지 복구

DISM.exe [dism_options] {Imaging_command} [] DISM.exe {/Image: | /Online} [dism_options]          {servicing_command} [] 설명  DISM에서 Windows 이미지의 기능 및 패키지를 열거, 설치, 제거, 구성 및 업데이트 사용할 수 있는 명령은 서비스되는 이미지에 따라 다름 사용할 수 있는 명령은 이미지가 오프라인 또는 실행 중인지에 따라 다름 FFU 명령/Capture-Ffu 실제 디스크 이미지를 새 FFU 파일로 캡처 /Apply-Ffu .ffu 이미지 적용 /Split-Ffu 기존 .ffu 파일을 여러 개의 읽기 전용 FFU 파일로 분할 /Optimize-Ffu 다른 크기의 저장소에 적용할 수 있도록 FF..

2024. 6. 4. 댓글
Article Thumbnail

CSS border width 지정 값과 디스플레이 불일치 이유

블로그 웹 페이지의 하나의 요소에 상하 border 값으로 각각 1px로 설정하였습니다.크롬 웹 브라우저를 띄우고 개발자 도구로 확인하니까 위의 캡처 이미지와 같이 0.727픽셀로 표시됩니다.CSS 파일에 "border: 1px"로 지정한 내역이 반영되지 않은 것입니다. 웹 브라우저와 사용하는 기기의 OS 설정 값을 조사하고, 변경하면서 결과를 눈으로 확인하면서 이유를 찾았습니다.일단, 웹 브라우저의 화면 확대 및 축소 그리고 기기의 OS에서 설정하는 글자 크기 설정과 화면 확대 및 축소 기능에 영향을 받는다는 것을 확인하였습니다.1. OS(MS Windows 11)의 시스템 / 디스플레이 설정 값 변경 ① 텍스트 및 기타 항목의 크기 변경② 연결된 디스플레이의 해상도 변경- 기본 값으로 100%와 모니..

2024. 5. 3. 댓글
Article Thumbnail

티스토리 스킨의 네임카드 CSS 코드 수정

수정이 필요한 서버 파일 comment.css의 네임카드 관련 코드 /* https://tistory1.daumcdn.net/ ... /style/comment.css */.tt_box_namecard { display: flex; justify-content: space-between; position: relative; min-height: 206px; background-color: #F7F7F7; margin-top: 20px; margin-bottom: 20px;}.tt_box_namecard .tt_btn_subscribe { display: flex; align-items: center; justify-content: center; height: 36px; margin-..

2024. 4. 25. 댓글
Article Thumbnail

CSS backdrop-filter, MS Edge에서 작동 오류

실행 환경: 윈도우 11(PC), 마이크로소프트 엣지 123.0.242081임시 복구: 엣지의 설정 / 시스템 / "사용 가능한 경우 그래픽 가속 사용" 변경 ※ "그래픽 (하드웨어) 가속 기능" 활성화시키면 유튜브 일부 동영상 재생할 때 끊김 현상이나 이미지가 일그러지는 사례가 발생할 수 있습니다. ※ 핸드폰과 같은 모바일 환경의 웹 브라우저에서는 필터 기능 정상입니다.  .filter { -webkit-backdrop-filter: saturate(180%) blur(20px); backdrop-filter: saturate(180%) blur(20px); background-color: rgba(0,0,0,0.3);} 웹 페이지에 반투명한 간유리 효과를 주는 backdrop-filter입니다.구글 ..

2024. 4. 9. 댓글
Article Thumbnail

Chromium 엔진 기반 웹 브라우저 버그

구글 Chromium 오픈 소스 프로젝트 기반 엔진을 사용하는 웹 브라우저 Microsoft Edge와 Google Chrome에서 페이지 렌더링에 오류가 발생하고 있습니다. Chromium의 버그로 추측하며, 최근 AI 기능 접목을 위한 브라우저 소스 코드 개편 과정의 코딩 실수가 누적되고 있는 것으로 짐작하고 있습니다. ※ Naver 웨일(Whale)도 Chromium 기반 엔진을 사용하고 있습니다. 웨일 최신 버전(3.25.232.19)에는 크로미움 122 업데이트가 적용되어 있으며, 마이크로소프트 엣지와 구글 크롬에서 발생하는 페이지 렌더링 오류가 발생하지 않습니다. 크로미움의 버전 차이가 있는지는 확인이 안되고 있습니다. 하나의 버그로 그치지 않고 다양한 이상 증상이 나타나고 있습니다. IT 기..

2024. 3. 16. 댓글