Notice
Recent Posts
Recent Comments
Link
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
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 |
Tags
- flexbox/grid 적용 여부
- flex container
- login button 컴포넌트
- git revert
- github
- createstore 취소선
- 카카오맵
- 모듈 관리
- REACT
- 프로그래머스
- Flexbox Froggy
- input 컴포넌트
- flexbox
- error
- 테스트 코드
- justify-content: center;
- 홍달쌤
- 정보처리기사실기
- 정보처리기사
- flex item
- 기사퍼스트
- 정보처리기사필기
- JWT
- froggy
- position
- Redux
- react 상태 관리 라이브러리
- 조건부 스타일링
- prettier
- 백준
Archives
- Today
- Total
목록align-items: flex-end (1)
minyoung

display: flex; 속성을 사용하면 Flexbox 레이아웃이 생성되며, 이때 기본적으로 main axis는 수평(가로) 방향이 됩니다. Flexbox에서 main axis는 주로 항목들이 배치되는 주축을 나타냅니다. 1단계 : justify-content: flex-end;수평이 기본 main axis로, justify-content: flex-end를 통해 오른쪽 끝으로 froggy 요소를 이동시킵니다.justify-content는 주축(main axis)이 기준입니다.flex-end: 요소들을 컨테이너의 오른쪽으로 정렬합니다.2단계: justify-content: center;수평이 기본 main axis로, 수평 기준 가운데로 위치시켜준다.center: 요소들을 컨테이너의 가운데로 정렬한다...
CSS3
2023. 12. 1. 16:42