지현의 개발자 성장과정

background-image에 no-repeat이 안되요 - 초심자의 깜찍한 실수

문제점 오늘 아래처럼 background-image를 추가하던 중, .select-btn { background-image: url(images/Polygon\ 1.png); } 드롭다운 박스를 만들면서, 아래화살표 이미지를 추가하기 위해 아래와 같이 속성에 no-repeat;를 추가하였다. .select-btn { background-image: url(images/Polygon\ 1.png) no-repeat; } 그랬더니 아래와 같이 이미지가 아예 사라져버렸네~ 내 화살표 어디갔니 개발자도구를 살펴보니 오류가 난 것을 알 수 있다. 해결 그리고 답은 의외로 간단하고 어이없었는데... stack over flow에서 찾을 수 있었다. https://stackoverflow.com/questions/1..

항상 헷갈리는 text-align, 딱 두 가지만 기억하자

text-align은 그 요소들을 담고있는 부모 박스요소에 줘야한다. text-align은 오로지 인라인 요소들만 컨트롤한다. 딱 이 개념만 확실하게 이해하고 있으면 된다. 1. text-align은 그 요소들을 담고있는 부모 박스요소에 줘야한다. 아래 사진처럼 div박스 안에 img, h1, p태그를 하나씩 주었다. french fries lorem bla bla 이 태그 안에 있는 컨텐츠들을 div박스 안에서 중앙정렬 시키고싶다. 이럴 때에는 컨텐츠들을 담고 있는 div박스에 text-align속성을 주어야 한다. div { text-align: center; } 부모 div 박스가 아닌 인라인요소인 이미지 자체에 text-align:center를 주면 안되나? 안된다. 왜냐? text-align은 ..

9주차 회고 - 이 순간 너무 소중해

내가 너무나 좋아하는 드라마 The Office의 최종화에 이런 말이 나온다. "I wish there was a way to know you're in the good old days before you've actually left them." 좋은 시절을 보내고 있다는 것을, 그게 떠나기 전에 알 수 있는 방법이 있었으면 좋겠어요. 나는 요즘에 누가 잘 하고 있냐고, 힘들지 않냐고 물어보면 '배울 수 있어서 행복한 시간 보내고 있다'라고 대답한다. 취업이 안될 까 두렵고, 이 개념이 나만 이해되지 않는 것 같아 불안한 그런 감정들은 국소적이고 편협하다. 주어진 상황을 객관적으로 바라보기가 어렵다. 그런데 한 발 짝 떨어져서 (십년 후에 내가 지금의 나를 돌아본다고 생각하면, 혹은 죽는 시점의 나?)..

알아두면 너무 유용한 네거티브 마진

네거티브 마진 쉽게 사용하면, 마이너스 값으로 마진을 설정하는거다. 어떨 때 사용할 수 있나? 우리가 생각하는 마진은 요소와 요소 사이의 공간을 줄 때 사용한다. 이걸 반대로 동작하게 하는게 네거티브 마진인데, 공간이 마이너스로 중첩되어버린다! 그럼 어떻게 될까? 지붕을 뚫고 나간다! 아래 사진을 예시로 보자. 감자튀김 이미지에 margin-top을 줌으로써 이미지를 담고있는 부모div와 공간을 넣어주도록 하겠다. .box img { width: 500px; height: auto; margin-top: 30px; } 위와같이 margin-top 공간이 생긴 것을 알 수 있다. 그렇다면 여기서 negative margin을 적용하여 이미지가 부모 div인 지붕을 뚫고 나가게 해보자! .box img { ..

node nodemon 설치시 code E404오류 해결

터미널에서 노드 설치하는 방법 1 npm install -g nodemon cs 맥은 가끔 위 명령어로 안될 때가 있다. 그럴 땐 1 sudo npm install -g nodemon cs 이후 패스워드를 입력해주면 된다. 아래와 같은 오류를 만났을 때 1 2 3 4 5 6 7 8 9 10 11 npm ERR! code E404 npm ERR! 404 Not Found - GET https://skimdb.npmjs.com/registry/nodemon/-/nodemon-2.0.15.tgz - not_found npm ERR! 404 npm ERR! 404 'nodemon@https://skimdb.npmjs.com/registry/nodemon/-/nodemon-2.0.15.tgz' is not in ..