231127 TIL

교육 개강 날

팀을 소개하는 웹 페이지 만들기 미니 프로젝트를 시작했다.

 

---

 

상세페이지 레이아웃 작업을 하는데

먼저 하나의 상세 페이지를 대략적으로 만들고

그 html 과 css 틀을 그대로 다른 팀원들 상세 페이지에 넣었더니

박스가 제멋대로 찌그러진다.

검사를 이용해서 확인한 margin 의 좌우 양옆값이 -이 아닌 29.~~~로 설정한 것과는 달라져 있었다.

margin: 10px auto 10px auto;

auto 값이 왜 페이지마다 달랐는지 이해하려면 더 알아봐야겠다.

일단 margin 좌우 값을 0으로 줬더니 다 동일해져서 해결은 됐다.

 

 

저번에 로그인 페이지 만들 때 활용했던 display :flex; 속성이 레이아웃 짜기에 정말 편한 것을 느꼈다.

그전엔 grid속성으로 조정해보려했는데 grid안의 이미지 크기가 뒤죽박죽되어버려서 해결하지 못하고 flex로 바꿔버렸다...

css 속성들을 잘 알고 써야지 활용할 수 있는 건데 조급한 마음에 이것저것 하다보니 이도저도 아니게 되어버린 것 같다.

---

팀원끼리 소개하고 S.A.작성한다고 고민하느라 시간을 많이쓰고

내가 맡은 부분에 아직 깊게 들어가지 않아서 한 게 없다...

내 부분 완성한 뒤에 기능 하시는 분들 도와서 뭐라도 같이 해야겠다