emayom.log

  • 방명록

8 columns 1

[CSS] 그리드 : 8 Column Grid

오늘은 어제 나눠서 만들어 본 발가락 담군 그리드를 수정하려고 한다. 우선 아래와 같은 배경 그리드를 만들고, 어제와 비슷한 가로 그리드 아이템들을 위에 배치해보자! 컨테이너(Container)의 사이즈는 1200px, 거터(Gutter)는 8px, 8단(Column의 그리드 글로는 헷갈릴 수 있으니 완성된 모습을 먼저 확인해보자! 8 Column Grid 8-column-grid.emayom.repl.co 큰 구조를 먼저 잡아보자. ① 컬럼과 거터를 보여주기 위한 배경 그리드를 바닥에 깔고 ② 그 위에 아이템들을 보여주기 위해 전체 컨테이너로 우선 묶어주고 시작했다! (이유는 뒷 부분에 가면 알게된다 🤔) 우선 ① 부터 해결하자. 8개의 칼럼과 거터를 보여줄 배경 그리드를 제작하기위해 col_conta..

CSS 2021.07.22
이전
1
다음
프로필사진

emayom.log

습관의 고리는 인식할 수 없을 정도로 너무 약해 보인다. 그러다가 끊어버릴 수 없을 정도로 막강해진다.

  • 분류 전체보기 (114)
    • HTML (2)
    • CSS (10)
      • SCSS (0)
      • CSS3 (0)
    • JS (32)
      • [Udemy] 클린코드 자바스크립트 (0)
      • Javascript (14)
      • React (12)
    • Programmers (46)
      • Algorithm, Data Structure (3)
      • Level 1 (36)
      • Level 2 (7)
    • FE interview (5)
    • etc. (16)
      • git (4)

Tag

기술면접, 리액트, css, 프론트앤드, 코테, 컴포넌트, 함수 선언식, javascript, html, programmers, JS, Jeklly, level 1, level1, 자바스크립트, 프로그래머스, React, 코딩테스트, input, 레벨 1,

최근글과 인기글

  • 최근글
  • 인기글

최근댓글

공지사항

페이스북 트위터 플러그인

  • Facebook
  • Twitter

Archives

Calendar

  2025. 07  
일 월 화 수 목 금 토
1 2 3 4 5
6 7 8 9 10 11 12
13 14 15 16 17 18 19
20 21 22 23 24 25 26
27 28 29 30 31

방문자수Total

  • Today :
  • Yesterday :

Copyright © Kakao Corp. All rights reserved.

티스토리툴바

개인정보

  • 티스토리 홈
  • 포럼
  • 로그인

단축키

내 블로그

내 블로그 - 관리자 홈 전환
Q
Q
새 글 쓰기
W
W

블로그 게시글

글 수정 (권한 있는 경우)
E
E
댓글 영역으로 이동
C
C

모든 영역

이 페이지의 URL 복사
S
S
맨 위로 이동
T
T
티스토리 홈 이동
H
H
단축키 안내
Shift + /
⇧ + /

* 단축키는 한글/영문 대소문자로 이용 가능하며, 티스토리 기본 도메인에서만 동작합니다.