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

forest님의 프로필 이미지
forest

작성한 질문수

애플 웹사이트 인터랙션 클론!

편안한 촉감 부분에서요~~

작성

·

152

1

안녕하세요 ㅎㅎ 강의 잘 듣구 있습니다.

크롬에서 아이폰x사이즈로 해서 테스트해보고 있는데요~

섹션2에서 첫번째 설명 부분을 보면, 

<p>
편안한 목넘김을 완성하는 디테일한 여러 구성 요소들, 우리는 이를 하나하나 새롭게 살피고 재구성하는 과정을 거쳐 새로운 수준의 머그, AirMug Pro를 만들었습니다. 입에 뭔가 댔다는 감각은 어느새 사라지고 오롯이 당신과 음료만 남게 되죠.
</p>

이 설명 부분이 화면 width를 넘어가버리는 현상이 생깁니다...

css 문제인줄 알고 desc-message부분에서 width를 줄여도 마찬가지네요... 

데스크탑 모드에서는 잘 작동하는데... 뭐가 문제인걸까요...??

답변 1

0

1분코딩님의 프로필 이미지
1분코딩
지식공유자

아- 확인해보니 CSS 문제가 맞네요~~
원래 .desc-message에  width: 50%가 되어있는데, 아래서 .sticky-elem에 width: 100%가 적용되어 덮어써지는 문제였습니다.
CSS에서
.desc-message.sticky-elem {
    width: 50%;
}
이런 식으로 선언을 더 구체화시켜주시면 우선순위에서 앞서게 되어 width: 50%가 적용 될거에요.
코드도 수정해놔야겠네요 감사합니다!

forest님의 프로필 이미지
forest

작성한 질문수

질문하기