# justify content

25개의 포스트

[22] 04/27 자바스크립트 수업

부모에게 적용하는 것: display:flex / justify-content / align-itemsleft, center, right, space-around, space-between, space-evenlystart, center, end자식에게 적용하는 것:

2023년 4월 27일
·
0개의 댓글
·
post-thumbnail

Flex pricing Table

html Result

2023년 4월 21일
·
0개의 댓글
·
post-thumbnail

Flexbox

01 Flexbox (Flexible Box Module) > flex-direction: row / column; flexbox에서 레이아웃의 방향을 결정하는 속성이다. row가 기본값이며 메인축 즉, 가로축 방향을 설정하고 왼쪽에서 오른쪽으로 item이 정렬된

2023년 4월 17일
·
0개의 댓글
·
post-thumbnail

Flex 레이아웃

CSS 레이아웃의 꽃 !특징을 변경할 때 사용한다.flex는 레이아웃 배치 전용 기능으로 고안되었기 때문에 float에 비해 훨씬 편리하다.block or inline으로 구분되지 않고 독자적인 속성을 가진 요소로 구분된다.위의 코드에서 부모요소는 container,

2023년 2월 20일
·
0개의 댓글
·

html/css_main페이지

mainpage 만들 때 찾아본 함수, 내용, 막혔던 부분

2023년 2월 10일
·
0개의 댓글
·

[CSS] flex 레이아웃 2-11

웹 사이트의 구조를 영리하게 짤 수 있다.display를 flex로 지정하면 플렉스 방식으로 자식 요소들을 배치하게 된다.inline-flex는 해당 컨테니어 요소를 인라인으로 만든다는 차이가 있다.flex-direction의 값row(가로로 왼쪽부터)column(세로

2023년 1월 25일
·
0개의 댓글
·

4-3. CSS문법 정리

display 속성이 flex로 설정되어 있으면 text-align 속성을 지정해도 가운데 정렬이 되지 않습니다.이 때는 위 예제와 같이 justify-content 속성을 설정해 주어야 합니다.padding : 100px 0; 여기서는 div의 padding을 지정하

2022년 12월 25일
·
0개의 댓글
·

Flexbox

flexbox = Flexible Box Moduleflexbox 내의 아이템 간의 공간 배분과, 정렬 기능을 제공하는 레이아웃 모델레이아웃을 다룰 때 한 번에 하나의 차원(행 or 열)만을 다룬다. = 1차원 모델display: flex 부모 박스 요소에 적용해, 자

2022년 8월 29일
·
1개의 댓글
·
post-thumbnail

Flexbox Froggy 24

두세 번만 더 써보면 완벽하게 체득될 듯ㄷㄷㄷ

2022년 8월 9일
·
0개의 댓글
·
post-thumbnail

Flex로 display 해버리기 [justify-content]

js빈에 작성하기 JS Bin 1 2 3 css .outter { width: 350px; height: 350px; background-color: green; display: flex; justify-conten

2022년 5월 25일
·
0개의 댓글
·
post-thumbnail

2022 04 29 CSS

수직 정렬을 할 때 쓴다.hover는 마우스를 올렸을 때 다른 동작을 하도록 만드는 것이다.그냥 hover를 쓰는 것은 문제가 없으나, 호버 해당 부위를 설정할 때는 이런 식으로 써야한다.여기서 자세히 보기https://studiomeal.com/archive

2022년 4월 28일
·
0개의 댓글
·
post-thumbnail

flex 요소 정리

flex 컨테이너 요소들에 대해 간략하게 정리

2021년 11월 30일
·
0개의 댓글
·
post-thumbnail

css_flex

11/8 다시 시작된 월요일 오늘은 아침부터 비가 엄청 쏟아지고 있다. 비소리에 놀라깼지만 사실은 어제밤부터 flex에 대한 개념이 흐릿해서 그 생각에 잠이 깼다. 수업듣기 전에 flex 좀 살펴보고 들어가야 겠다. 1. flex 📗 flex 이전의 이야기... f

2021년 11월 8일
·
0개의 댓글
·
post-thumbnail

[CS] Content 정렬 Day-14

Flexbox를 원하는대로 제어하기 위해서는 axis(축)을 잘 이해해야 합니다.axis(축)은 main axis와 cross axis가 있습니다.main axis는 flex-direction 속성에 의해 결정됩니다.flex-direction의 기본 값(row) 상태

2021년 10월 21일
·
0개의 댓글
·
post-thumbnail

CSS 중급

클래스 이름과 구현을 1:1로 일치시켜 아주 작은 단위로 CSS를 작성하는 기법기본 스타일링 제거하는 CSS 코드방향: flex-directionrow(기본값)column얼마나 늘릴 것인가: flex-grow얼마만큼의 크기를 갖는가: flex-basis수평 정렬: ju

2021년 10월 21일
·
0개의 댓글
·