css3 drawer in m.youtube ytm-engagement-panel ytm-engagement-panel-section-list-renderer.engagement-panel-comments-section .engagement-panel-section-list-background.draggable .engagement-panel-container .engagement-panel-section-list-header-wrapper .engagement-panel-content-wrapper ytm-section-list-renderer ytm-single-column-watch-next-results-renderer aria-hidden .player-size { position: relative; width: 100%; padding-.. 2021. 11. 21. [211004] glowing effect, guidelines glowing effect box-shadow와 text-shadow로 구현한 것 같은데, 현실의 어떤 물리적인 사물을 이렇게 웹에서 구현할 때 너무 짜릿함... awesome guidelines 가이드라인 같은 단어만 보면 게걸스럽게 북마크에 담는 사람(주니어) 작은 글씨에 안티앨리어스 효과 transform: rotate(0.03deg) 놀랍도다 2021. 10. 4. 웹 페이지 로드 이후 HTML 엘리먼트의 위치가 바뀔 때 개츠비로 포트폴리오를 만들다가 메인이 좀 심심해보여서 이미지를 추가했다. 그런데 웹 페이지가 로딩 되는 동안 (1) 우선 이미지가 보이고, 웹 페이지가 전부 로드된 이후에야 (2) 그 이미지가 제 자리를 찾아가는 현상이 발생했다. div_1 position: relative; div_2 img position: absoulte; 알고보니 img가 두 단계로 중첩돼서 그런 거였다. 내 코드를 보면 중첩된 대로 div_1 → div_2 → img 가 차례대로 렌더링이 되고 나서 img의 position: absolute가 적용된다. (div_2는 div의 default position인 static이 적용되기 때문. 이 경우 엘리먼트는 순서대로 렌더링 된다.) 그러면 img는 div_2를 뛰어넘고 posit.. 2021. 5. 2. 이전 1 다음