inflearn logo
강의

강의

N
챌린지

챌린지

멘토링

멘토링

N
클립

클립

로드맵

로드맵

지식공유

플렉스(Flex) 반응형 웹사이트 포트폴리오(The World's Best Cities)

[응용 예제] 스크롤 없는 높이 100% 레이아웃

스크롤이 없는 레이아웃의 장점은 무엇인가요?

631

hoya

작성한 질문수 8

1

안녕하세요, 강사님

차근차근 이해할 수 있게 설명해주셔서 잘 배우고 있습니다.  정말 감사합니다!

스크롤이 없는 레이아웃의 장점이 구체적으로 어떤 부분에 있는지 궁금합니다.

다른 강의들을 몇 개 보다가 들은 내용으로는 "반응형 작업을 위해서 스크롤이 없어야 한다"는 설명도 얼핏 들었던 것 같기도 한데,  일반적인 사이트에서는 보통 스크롤(세로)이 있잖아요? 그래서 이번 편에서 배운 예시가 실제로는 주로 어느 페이지 레이아웃에서 쓰이는지 궁금합니다!

감사합니다.

반응형-웹 flex

답변 1

4

코딩웍스(Coding Works)

스크롤 없는 레이아웃의 장점 단점은 없습니다.
다만 스크롤을 없애고 높이를 가득 채워야 하는 상황이 퍼블리싱하다 보면 있습니다.
그때를 대비해서 calc라는 사칙연산을 연습하시는거지 지금 예제에서는 꼭 이렇게 스크롤을 없애야 한다 이런건 아닙니다.
사실 레이아웃을 만들고 내용을 넣다보면 내용일 길어져서 당연히 스크롤이 생깁니다.
이런 경우에 해당되는게 아니라 필요한 경우를 대비해서 연습하신다 생각핫기면 됩니다.

"반응형 작업을 위해서 스크롤이 없어야 한다" 라고 설명한 기억은 잘 없는데..
아마도 가로 스크롤은 당연히 없애야겠죠.

아래와 같이 헤더와 푸터의 높이를 뺀 나머지 높이에 로그인 화면을 정확히 중앙에 위치시겨야 하는 경우에 주로 사용됩니다.

가로스크롤

1

458

1

상위 태그 영역 무시 하는 방법

1

842

2

반응형 적응형 구분

2

802

2

flex가 적용되면 하위에 있는 인라인의 속성은?

1

359

1

슬릭 슬라이더 버튼

1

370

1

slick 모바일로 변환했을때..

1

607

1

x scroll 이 왜 생기는 걸까요?

1

870

1

영상 16분 field margin-left 문제 (다운로드 교재도 동일한 문제)

1

249

1

모바일에서 이미지 짤림 현상

1

2741

2

질문 있습니다

1

241

1

안녕하세요

1

259

1

모바일버전에서 스크롤이 생겨서요 ㅜㅜ

1

289

1

반응형 헤더 네비게이션 공부중인데요. 궁금한것이 있어서요.

1

387

2

슬라이딩 스크롤이 이상하게 먹혀요!

1

407

2

slick slider 하는데 패딩이 안먹혀요

1

764

2

제이쿼리 부드럽게 스크롤할때 제이쿼리에 밑줄오류가 있습니다.

1

317

1

혹시 이 강의 싸이트를 혼자의 힘으로 만들수 있으면 어느정도 실력정도 되나요?

1

250

1

소스랑 자료 다운로는 어디서 받을 수 있나요?

1

299

1

반응형 헤더 네비게이션 강의 질문있습니다.

1

203

1

그 반응형 질문 있습니다

1

225

1

질문드립니다 강사님

1

287

2

flex 레이아웃 배치 질문있습니다.

1

220

1

미디어쿼리 반응형 만들때 사이즈 질문있습니다.

1

201

1

인라인요소인 label 에 margin-bottom 이 되다니... 어렵습니다.

1

972

1