1215 6699 devLog (2nd day)

오늘 한 것

footer 완성,mypage완성,router정리

막혔던 점

• css 가운데 정렬 3가지 방법

1. text-align: center;
2. margin: 0 auto;
3. transform:translate(-50%,-50%) 하고나서
   top:50%, left:50% 하면 된다 후후

• 어제는 어디를 flex를 쓸지 어디를 flex 안써야하는지 감이 안왔었다. 불규칙한 배치부분은 flex 안쓰는게 좋을 것같다.

• justify-content로 flexbox안의 flexitem들을 어떻게 균등하게 배치할 지 정할 수 있다.

• figma에서 도형을 떼서 image로 가져올 수 있다.

• flex-direction이 column일 때 justify-content를 하면 row일때와 달리 세로방향으로 가운데에 위치한다. 가로방향도 가운데를 원한다면 align-items:center를 써주자 ㅇuㅇ

• flex안에있는 이미지는 뭉개질 수 있다.. 그럴땐 flex:none을 입력하자.

• display:fixed로 header를 천장에 고정시켰다.

• z-index를 이용해서 컴포넌트를 마치 figma의 bring to front처럼 맨 앞으로 끄집어낼 수 있다.

• inline요소는 flex:inline-flex로 써준다.
  --> ??????

• 줄바꿈을 할때엔 wrap을 사용한다.

• id를 mypage-pagenation2로 썼을 때는 안보이다가 mypage-pagenation-2라고 쓰니까 보였다.
  --> ?????

• react-router-dom 문법이 변했다.

참고

css가운데정렬
flex-poiemaweb
flex2
달라진 react router