[CSS] flex 속성 정리
부모 구분 속성 기본값 축약 방향 flex-direction row flex-flow *값의 위치는 제약이 없다. [예제] flex-flow: cloumn wrap flex-flow: wrap cloumn 줄바꿈 flex-wrap nowrap 정렬 justify-content normal place-content [값이 1개인 경우] place-content: align-content | justify-content *align, justify 값이 동일하게 적용 [값이 2개인 경우] place-content: align-content justify-content *띄어쓰기로 값을 구분한다. [예제] gap: center gap: 8px 16px align-content normal align-items..
이론/CSS
2021. 3. 9. 16:33
[CSS] Q. flex에 justify-items와 justify-self는 없나요?
justify-content는 그룹으로만 항목을 처리하기 때문에 justify-items. justify-self 속성이 없다. (보통 align-iems와 함께 사용하다보니, justify-content가 item을 정렬하는 것으로 오해를 많이 한다.) 그렇다면 justify-self를 사용하지 않고, 단독 정렬은 어떻게 해야할까? 정렬할 대상에 margin-방향: auto를 사용한다. See the Pen [CSS3] flex의 justify-self처럼 단독으로 정렬하는 방법 by mill (@millfeel) on CodePen.
이론/CSS
2021. 3. 9. 13:36
공지사항
최근에 올라온 글
최근에 달린 댓글
- Total
- Today
- Yesterday
링크
TAG
- 링크막기 #a링크막기
- prototype 프로퍼티
- outerHeight
- offsetTop
- @font-face
- 불일치 연산자
- 객체의 프로퍼티
- __proto__
- 일치 연산자
- javascript class
- 점 표기법
- 프로퍼티
- 동등 연산자
- clinetTop
- clientHeight
- 부등 연산자
- constructor
- [[Prototype]]
- scrollHeight
- 동치 연산자
- 대괄포 표기법
- scrollTop
- offsetHeight
- property
- innerHeight
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
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 |
글 보관함