• 카테고리

    질문 & 답변
  • 세부 분야

    웹 개발

  • 해결 여부

    미해결

제가 질문이 좀 많습니다. 죄송합니다.

20.12.11 00:45 작성 조회수 159

1

완강하고 완전히 저의 것으로 만들기 위해 혼자서 여러번 처음부터 끝까지 하다가 딱 여기서 project 반응형으로 수정할때, 막혀 고생했던것들 관련하여 질문올립니다.

뭐냐면, 

우선 웹상에서 선생님께서 버튼을 누르면 tabs가 움직일때, margin-left 로 조정해서 하셨지만,

저는 project-inner에 position: relative; 를 주고
tabs에 position: absolute;를 준뒤,
움직임은 left값으로 조정해서 구현을 했었습니다.

그러니까 문제가 뭐였냐면,
이 반응형에서, 선생님께서 알려주신대로,
height값 들을 auto로 하고, 만드니,

project-inner 부터(색깔 있는 보더를 그려주니 알게 되었습니다.) 높이값이 안나와 굳이 구현을 하려면, 
높이값을 auto가 아닌 수동으로 잡아줘야 했고,
btn도 위치가 이상해지고 알 수 없는 빈 공간도 막 생기고,
뭐가 문제인지 모르겠더라구요.

선생님 처럼, position 값으로 움직이는게 아니라,
margin-left 값으로 움직이게 한 후 모바일반응형으로 높이를 height를 주면 문제가 없는데 말이죠.

그 이유를 혹시 알 수 있을까해서 여쭤봅니다.

제 스스로 내리는 판단하에서는 이렇게 움직이나 저렇게 움직이나 웹상에서는 문제가 없는데,

제가 했던 방식으로는 반응형으로 할때 구조가 이상해지니, 분명 더 명확한 방법이 있을 것 같은데, 현재 완전히 구현하려면 선생님의 방식으로 가는것 밖에는 없더라구요.

제 질문의 요지를 이해하셨는지 잘 모르겠습니다만,
이해가 가셨다면, 답변을 부탁드리겠습니다.
자꾸 귀찮게 해드리는것 같아 죄송하지만, 답을 알면 속이 시원할 것 같습니다. 감사합니다. 

답변 2

·

답변을 작성해보세요.

1

메일 주신거 확인해봤는데요.

모바일 버전 프로젝트 섹션에서 탭 메뉴 누르는 버튼이 이미지와 겹치는 아래와 같이 나오는 문제 때문에 그러시는 것 같아요.

이 부분을 아래 처럼 원래 위치로 하시려고 하시는 것으로 생각됩니다.

이 부분은 아래 이미지처럼 responsive.css에서 .detail > div에 width가 110펙셀이어서 모바일에 따라 마지막 div가 아래로 줄이 떨어지는 현상 때문에 밀린 것으로 보입니다. 그래서 아래처럼 너비를 좀 줄여주세요. 기본은 width: 110px 인데 100픽셀 정로 줄여주시면 첫번째 이미지처럼 마지막 div가 아래로 떨어지지 않을거에요. 그리고 .detail에 text-align: center  주셔서 자식 div들을 중앙 정렬 시켜주시구요.

1

질문글만 봐서는 이해하기가 쉽지 않네요.

일단 파일을 봐야 할 것 같아요.

작업중인 파일 압축해서 이메일로 보내주세요.

cebuandy71@gmail.com