inflearn logo
강의

Khóa học

Chia sẻ kiến thức

Portfolio trang web phản hồi (Trang web giới thiệu chính thức của ứng dụng)

Công việc thay đổi layout di động (12) – Header (header) & Modal

브라우저를 줄일 때 화면 깨짐

Đã giải quyết

633

qltnf1238123

1 câu hỏi đã được viết

1

pc버전에서 브라우저 화면을 줄일 때 저렇게 화면이 깨지는데

실제 다른 웹 사이트 처럼 화면을 줄여도 안 깨질려면 max-width 768 버전 말고 max-width 1200도 같이 만들어줘야 하나요?

HTML/CSS jquery 반응형-웹

Câu trả lời 2

1

codingworks

브라우저 줄일 때 아예 가로 스크롤을 만들지 않으려면 Flex로 배치하는 것이 가장 이상적입니다.

그런데 지금 강의는 플렉스를 사용한 강의가 아니니까 나중에 플렉스를 배우시고 웹사이트 만드실 때 하시면 됩니다.

1

codingworks

태블릿까지 생각하면 min-width: 768px and max-width: 1024px 해주시면 됩니다.

그런데 현재는 실무에서 하는 작업은 아니니까 max-width 768 이 정도까지만 하셔도 좋습니다.

물론 하시면 좋지만 손이 너무 많이 갑니다.

그리고 화면처럼 보이는게 보기 싫으시면 max-width: 1200에서만 네비게이션 부분만 퍼센트로 조정하시면 됩니다. 만약 header의 inner가 1200에 오면 width: 100% 이런 식으로 해주시면 됩니다.

1

qltnf1238123

브라우저를 줄일 때 아예 가로 스크롤이 안생기는 방법은 없나요?

하드코딩으로 이미지맵(image map) 만들기

1

79

2

슬릭 슬라이더

1

148

2

position: fixed; 가 안먹혀요..뭐가 문제일까요?

1

168

1

반응형 fixed 안먹히는 문제

1

264

2

선생님

2

155

1

.news-thum .date 위치가 안맞아요

1

245

2

TypeIt - Welcome 부분이 적용이 안됩니다..

1

369

2

Scroll Reveal Animation 적용이 안되요

1

362

1

완성 후 각 섹션 display:none 주석 시 문제

1

384

3

welcome-heading 부분이 왜 저렇게 위치되는지 모르겠습니다.

1

341

1

제이쿼리 탭메뉴 클릭 질문

1

236

1

질문있습니다

1

549

1

질문있습니다.

2

646

2

슬릭슬라이더가 왜 안되는지 모르겠습니다

1

623

1

slick slider와 .ceo-content영역 겹침

1

720

1

span .badge 부분 참고하실분 하세요

2

333

1

플렉스를 안주고 그냥 패딩을 줘도 되지 않나요

1

331

1

창을 줄이면 위치가 이동되는 백그라운드 이미지

1

532

1

크롬창을 줄어들면 이미지가 작아짐

1

743

1

scroll behavior 오류

1

267

1

선생님 코딩좀 봐주세요..

1

402

3

왜 전 선생님과 화면이 다를까요?

1

368

3

따라했는데 이상합니ㅏㄷ..ㅠ

1

295

2

flex로 된 부분을 좌우로 애니매이션 할때 발생하는 문제점.

1

212

1