오늘 한 일

  • 어제 TIL도 안 썼으면서 너무 늦게 잤더니 피곤하다... 잠은 자면서 합시다ㅠㅠ
  • 베타 테스트 준비 마무리 작업을 했다. 상황에 맞게 에러 메시지 띄우는 거나 인도네시아어 번역이 필요한 부분이나 아니면 모바일 화면에 대응하는 반응형 작업(페이지가 하나라 다행)이나 간단한 CSS 조정 등등 뭐 자잘한 것들이긴 했는데 이것저것 따지다 보니 생각보다 시간이 걸렸다.
  • 테스트 하는 셈치고 빌드 한 번 해보려니까 빌드 해 놓은 URL로 접속이 안 됐다. 한참을 헤매다가 깨달았다. serve -s build 해놓고 도대체 왜 이게 안 되는지 고민하고 있었던 것이었다. serve -s dist 해야 하는데... 나 자신아 정신 차려
  • pr 날리기 전 작업이 거의 막바지에 이를 때쯤 세로로 나란히 정렬한 두 div가 브라우저 화면 높이를 줄이면 겹쳐버린다는 것을 알아차렸다. 아래쪽 div는 position: relative를 준 상황이었다. 온갖 삽질 다 하며 시간을 보내다 아래 링크 덕에 양쪽 div 모두에 height: auto로 설정(이미 지정한 높이가 있으면 그건 min-height로 바꿔버렸다)하고 display: block을 주니 겹치지 않고 제 자리를 찾았다. CSS 진 빠져
  • 그리고 pr을 올렸다. 물론 이게 끝이 아닐 거라는 걸 나도 안다

오늘 배운 것

  • 구글링 할 때 검색어 선택만 잘 해도 원하는 결과는 금방 나오는 것 같다. 처음에는 display, relative, div, height, ... 로 검색해 봤는데, 지금 생각해 보니 핵심 키워드는 overlapping이었던 것 같다.
 

When using CSS, how can I prevent my DIVs from overlapping when I shrink my browser?

Answer (1 of 14): You can use display:block for the specific div which you would not want to get overlapped. [code]#div{ display:block; } [/code]Additional Info: Responsive design Try to use percentages(%) as page width instead of pixels(px). So that, when

www.quora.com

  • 기본 vue.js favicon을 바꾸게 되어서 가지고 있던 svg 파일을 아래 링크에서 변환해서 사용했다.
 

Favicon Generator for perfect icons on all browsers

The ultimate favicon generator. Design your icons platform per platform and make them look great everywhere. Including in Google results pages.

realfavicongenerator.net

 

+ Recent posts