애드센스블로그1 CSS Grid로 티스토리 카드형 레이아웃 (반응형, 스킨충돌, 매거진) float 코드 수십 줄을 다 버리고 CSS 다섯 줄로 끝낸 날, 솔직히 허탈했습니다. 그 전날 밤을 새웠거든요. 티스토리에 카드형 레이아웃을 넣고 싶다면 CSS Grid가 거의 유일한 정답에 가깝습니다. 단, 코드를 복붙하기 전에 반드시 확인해야 할 게 있습니다.반응형 카드 그리드, 코드보다 스킨 구조가 먼저입니다CSS Grid를 처음 제대로 써본 건 티스토리 리스트형 스킨을 카드형으로 바꾸려고 했을 때였습니다. float로 2열 레이아웃을 만들었는데, 카드 높이가 조금만 달라지면 레이아웃 전체가 어긋났습니다. clearfix를 추가하고, 음수 마진도 써보고, 온갖 방법을 시도했는데 결국 근본적인 해결이 안 됐습니다. 그때 Grid로 갈아탔고, display: grid에 repeat(2, 1fr) 한 .. 2026. 4. 16. 이전 1 다음
