안녕하세요 강사님. 반응형 설정에 대해서 질문이 있습니다.

실전! 웹사이트제작! Step By Step! _Basic (한화캐미컬_반응형웹)

작성

233

안녕하세요 강사님!

훌륭한 강의 잘 듣고 있습니다.

반응형 웹사이트 파트를 듣고 있는데

웹사이트를 노트북으로 켠 후 사이즈를 줄여보면

사진과 같이 텍스트가 줄바꿈이 되어 표시되고 more 버튼도 내려앉게 됩니다.

텍스트가 p태그로 작성되어있는데 혹시 이런 경우는 어떻게 수정하면 좋을까요?

답변 4

질문자

해결했습니다. 감사합니다!!

지식공유자

원래 반응형 웹이라는게 콘텐츠의 구조나 배치가 유동적으로 유연하게 움직이기 때문에 줄바꿈 현상이 일어나는것은 당연합니다 ^^ ㅎㅎ more 버튼이 줄바꿈 때문에 위치가 다른것을 수정하고 싶으시다면

1. ssection.about ul li a .text 에 높이 값을 주신 다음 position: relative; 준다음

2. more 버튼에 position: absolute; 로 bottom:0 에 위치하도록 해주시면 고정이 됩니다

그렇지만 테블릿 디바이스로 넘어가면서 (768px) 내용들이 세로로 나열 되기 때문에 높이값을 주지 않아도 됩니다

그래서 (768px) 일때 다시 .text 높이값을 auto로 변경해주시면 됩니다. 적용해보시고 어려우시다면 다시 질문주세요 ^^

좋은 저녁 되세요 ^^

질문자

1920 x 1080 입니다!

지식공유자

SangJoon Yoon님^^ 안녕하세요? 노트북해상도가 어떻게 되시는지요?

인프런 커뮤니티 질문&답변