[Angular] -webkit-line-clamp is not working (v.7.1.2)
·
개발일지/2019
앵귤러6에서 이미 리포트 된 내용이라고 한다. 현재 앵귤러 v.7.1.2에서도 같은 문제가 발생해서 찾아보게 됐다. https://github.com/angular/angular/issues/24183 -Webkit-Line-Clamp Not Working in Angular 6 · Issue #24183 · angular/angular I'm submitting a... [ X ] Regression (a behavior that used to work and stopped working in a new release) [ ] Bug report [ ] Performance issue [ ] Feature request [ ] Documentation issue or requ... github.com ..
[SVG] background-image에 SVG를 넣어 사용하기 (업데이트 21.04.15)
·
개발일지/2019
1. SVG 코드를 활용할 순 없을까? See the Pen gyrqYe by zinee (@zineeworld) on CodePen. 2. SVG 코드를 Data URI로 변환하기 검정색 아이콘이 SVG의 Data URI 값을 넣은 것이고, 파란색이 SVG 코드를 그대로 넣은 것입니다. IE 에서는 background-image 에 코드를 넣으면 보이지 않는 다는 것을 확인했습니다. 아래 주소를 각 브라우저에 띄워 확인해 보실 수 있습니다. https://zineeworld.github.io/demo/svg_fonticon_test.html 을 주로 변환하는 단순한 작업이지만 아래 사이트를 이용하면 빠르고 쉽게 변환이 가능합니다. (2021/04/15 수정) 위 사이트를 통해 SVG 코드를 Data-U..
[Sass] CSS로 아이콘(chevron, >) 그리기
·
개발일지/2019
'>' 모양이 단순하니 CSS로 그릴 수 있지 않을까 하고 생각했습니다. 사각형의 테두리를 2면에만 그리고 -45도로 회전시키면 '>'와 같은 모양이 그려집니다. 1px로 그려지는 '>'을 나타내기엔 쉽고 빠른 방법입니다. See the Pen [CSS] link hover style by zinee (@zineeworld) on CodePen.
알파벳으로 파비콘 만들기
·
개발일지/2019
지니월드를 나타낼 수 있는 'Z' 로 간단하게 파비콘을 만들려고 알아보다가 발견한 사이트입니다. 간단하게 포토샵이나 디자인 툴 없이 웹에서 파비콘을 만들 수 있습니다. https://favicon.io/favicon-generator/ 다운로드하면 이렇게 세트로 받을 수 있습니다.
getaddrinfo ENOTFOUND localhost
·
개발일지/2019
요약 [문제] 뭘 잘못 건드린 건지 갑자기 ng serve 가 안 되네요. [에러] getaddrinfo ENOTFOUND localhost [해결] /etc/hosts/ 파일에 localhost 가 포함되었는지 확인하세요. [출처] https://stackoverflow.com/questions/35757799/webpack-dev-server-cant-find-localhost 상세과정1. 터미널에서 /etc/hosts 을 엽니다.$ sudo vi /etc/hosts 2. 파일이 비어있다면 127.0.0.1 localhost 를 입력합니다.아무것도 없네요 i 를 누르면 insert (입력) 이 가능해집니다. 127.0.0.1 localhost 를 입력합니다. ESC 키를 누르고 :wq 를 적고 ent..
[HTML] OS/브라우저마다 다르게 보이는 select
·
개발일지/2019
윈도우/크롬select의 color: #fff을 상속받아 option 값에도 흰색이 적용되어 있다.따로 option에 color: #000을 넣어주었다. 윈도우/엣지 윈도우/파이어폭스 맥은 거의 비슷하게 보이네요 크롬 사파리 파이어폭스
[JS] User Agent 브라우저 정보 얻기 (크롬인지 아닌지 체크하기)
·
개발일지/2019
크롬 다운로드를 권장하기 위해서 띠배너를 보여주는데, 크롬 브라우저일 경우에는 보이지 않아야 한다. 어떻게 하면 크롬 브라우저 인지 알 수 있을까? userAgent를 통해 확인 할 수 있다. UserAgent 관련 정보가 정리된 곳https://developer.chrome.com/multidevice/user-agenthttps://developers.whatismybrowser.com/useragents/explore/hardware_type_specific/mobile/1Step1. MacOS ChromeMacOSChrome : Mozilla/5.0 (Macintosh; Intel Mac OS X 10_13_6) AppleWebKit/537.36 (K..
[웹폰트] 눈누, 이렇게 예쁜 무료 한글 폰트가 한곳에..!
·
개발일지/2018
상업용 무료한글폰트 사이트 '눈누'https://noonnu.cc/ 한글 폰트라고 하면 나눔고딕이 전부인 나에게 진짜 천국과도 같은 곳KCC-은영체 너무 취향저격이다...... 크흡 서버비 때문에 언제까지 운영될 수 있을까... 약간 걱정이 된다.진짜 좋은데 ㅠㅠㅠㅠㅠ 어디서 통크게 후원 안해주나 ㅜㅜㅜ 눈누 펀딩하러가기 >> https://www.wadiz.kr/web/campaign/detail/28025?utm_source=unknown&utm_medium=maker_noonnu 눈누 영상 from Project Noonnu on Vimeo.
[CSS] iOS 11.2.1 max-height: calc(% - px) is not working
·
개발일지/2018
문제환경 : 아이폰X iOS 11.2.1 (크롬, 사파리)문제현상 : 트레이드 페어 드롭다운이 보이지 않음문제원인 : max-height: calc(100% - 44px) 이 먹히지 않음 해결방법특정 iOS 버전에서 발생하는 이슈라고 생각하여, min-height: 85% 값을 방어책으로 넣어 둠85% : iphone5 (최소 디바이스 사이즈) 기준으로 가로모드에서도 하단이 잘리지 않는 값정상적인 다른 버전에서는 max-height 값이 더 크기 때문에 min-height 값에 영향없음 문제해결과정화살표 방향, 배경색이 바뀌는 것으로 보아 .is-open 상태는 정상적으로 ON/OFF 되는 것으로 확인DOM 구조상 dropdown 부분이 제일 하단에 있어서 z-i..