# Flex

77개의 포스트

CSS | Layout : position sticky, flex

css만으로 인스타그램에서 스크롤 해도 고정된 위치를 갖는 "회원님을 위한 추천" 부분 구현하기

3일 전
·
0개의 댓글
post-thumbnail

CSS_layout

CSS 레이아웃, flex-box

2021년 4월 24일
·
0개의 댓글
post-thumbnail

css 헷갈리거나 잊기쉬운 속성 정리

flex를 쓸 때 다른 속성들보다 쉽게 잘 안써지는 속성이면서 잘 기억에 남지 않는 기본 속성들인 grow, shrink, basis그리드는 flex보다 좀 더 복잡하고 기억하기 쉽지 않지만 훨씬 많응 용도로 사용가능하다.grid-tempate-rows / grid-t

2021년 4월 22일
·
0개의 댓글
post-thumbnail

flex

연습 : https://flexboxfroggy.com/justify-content :align-itemsflex-directionorder : 0을 기본으로 순서를 바꿈align-self: 객체하나에 대한 정렬 (align-item과 같은 명령어 이용)fle

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

CSS flex

flex: 속성

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

[TIL] flexbox 에서 div 한 개만 우측 정렬하기

아래와 같이 하면 됨. 또 다른 방법으로는 왼쪽에 할 것들을 div 로 한 번 더 싸는 방법 참고: https://stackoverflow.com/questions/35269947/how-can-i-align-one-item-right-with-flexbox https://d2.naver.com/helloworld/8540176

2021년 4월 20일
·
0개의 댓글
post-thumbnail

[TIL] Layout A to Z

이미지 주위의 텍스트를 감싸기 위해 처음 만들어졌다. 위와 같이 사용하며 float의 속성값으로 left, right, none을 대표적으로 사용할 수 있다. 단어 의미 그대로 left는 선택한 요소를 좌측으로 옮긴다는 의미이며 right는 오른쪽 none은 움직이지

2021년 4월 14일
·
0개의 댓글
post-thumbnail

flex를 이용해 nav bar 정렬 tip

flex를 이용해 태그들을 row 정렬을 한다.align-items를 이용해 center를 맞춰준다.원하는 자식 태그를 기준으로 위 사진과 같이 정렬하려면HOME 태그의 margin-right:auto; 혹은about 태그의 margin-left:auto;를 설정해준다

2021년 4월 13일
·
0개의 댓글
post-thumbnail

[css] flexbox

flexbox를 알아보자.

2021년 3월 29일
·
0개의 댓글
post-thumbnail

TIL 08 | CSS Flex-box

1. Flex-box Flex-box는 box 정렬의 끝판왕이다!! 기존에 요소들의 수직 정렬은 크게 문제가 되지 않았지만, 수평 정렬의 경우 float 와 clearFix, display: inline-block의 도움을 받아왔다. 하지만 이러한 방법들은 다양한

2021년 3월 28일
·
0개의 댓글
post-thumbnail

TIL : CSS Flex

자꾸만 헷갈리던 CSS의 Flex 속성 본격 대 정 리

2021년 3월 28일
·
0개의 댓글
post-thumbnail

CSS Flex box 사용해보기

flexbox 기본개념 메모

2021년 3월 27일
·
0개의 댓글

CSS grid, flex

word-break:break-all;테이블 만들고 박스 크기에 맞춰 다음줄로 넘길때 사용

2021년 3월 22일
·
0개의 댓글
post-thumbnail

FLEXBOX FROGGY

게임으로 배우는 flexbox!

2021년 3월 15일
·
0개의 댓글
post-thumbnail

CSS flex

오늘은 react를 하면서 flex에 대해 오류가 생겼던 부분에 대해서 기술하려고 한다.요소 작성 부분에서 요소들을 flex로 설정을 하지 않을 시에 내용들이 가로로 생기지 않는 오류가 생겼다. 지금의 경우 이렇게 요소가 가로로 쌓이고 있지만 styled-compone

2021년 3월 14일
·
0개의 댓글

css flex

기존 css에서 불가능하거나 굉장히 어렵게 구현했던 것들을 좀 더 쉽게 구현 할 수 있도록 css3에서 추가된 레이아웃 방식.flex는 자식 요소에게만 적용된다. 후손은 적용되지 않음flex의 방향에 따라 100%의 기준이 달라짐 \- ex flex-directio

2021년 3월 1일
·
0개의 댓글

(CSS) flex : 아이템에 적용하는 속성

flex 아이템에 적용하는 속성들 유연한 박스의 기본 영역 : flex-basis flex-basis는 flex 아이템들의 기본 크기를 설절한다. (flex-direcrion이 row일 때는 너비, column일 때는 높이) flex-basis의 값으로는 width와 height 등에 사용하는 각종 단위의 수를 사용할 수 있고, 기본값으로는 auto ...

2021년 1월 31일
·
0개의 댓글

(CSS) Flex

레이아웃 배치 전용 기능으로 고안된 Flex는 기존 사용하던 float나 inline-block 등을 이용한 기존 방식보다 훨씬 강력하고 편리한 기능들이 많다.

2021년 1월 31일
·
0개의 댓글
post-thumbnail

TIL_20 | [HTML/CSS] float는 그만! 강남 Frog의 Flex~🐸💎

오늘은 같이 공부하는 분께 FrontEnd에게 찰떡같은 비유를 들어서 그것으로 시작하려고 한다!ㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋ진짴ㅋㅋㅋㅋㅋ찰떡같은....ㅠㅠ다들 이런 경험 한번씩 있을 것 같다! (맞아요 제 얘기입니다..)나는 특히 css중에서도 floa

2021년 1월 20일
·
4개의 댓글