Component
components 부분의 작업 과정을 기록합니다.
Last updated
components 부분의 작업 과정을 기록합니다.
Last updated
컨테이너에 375px로 최소너비를 지정했을 때 margin-left의 여백이 없어지는 현상이 나타난다.
해결, 컨텐츠들 중에 고정값으로 되어 있는 요소들 때문이다. 그렇기 때문에 반응형웹을 만들 때는 스타일링을 할 때 수시로 반응형 결과를 보면서 만들어야 한다.
lg에서 x-lg로 브라우저의 너비가 바뀌는 과정에서 max-width 값 때문에 x-lg로 바뀔 때 컨테이너의 크기가 갑자기 작아진다. 이를 자연스럽게하기 위해 x-lg의 값을 1300px로 변경하였다.
1300px의 값은 lg에서 max-width: 92vw가 적용된 상태에서 컨터이너의 너비가 1200px과 가까워지는 값을 확인하여 설정하였다.
resetLink:hover에서 textdecoration이 설정되어 있었다. 이전에 css 작업에서 실수로 전역 스타일로 적용한 것이다. 바로 제거했다.
왜 적용이 안될까하며 검색했더니 상태클래스를 중첩 할 때는 &가 꼭 있어야 한다.
[stackoverflow]Sass Nesting for :hover does not work
Section의 컴포넌트에 padding-top/bottom이 적용되어 있어서 다른 곳에 재사용하기 힘들었다. 아직 컴포넌트로 사용할 공용 스타일과 아닌 것을 보기에 미숙한 것 같다.
그래서 위의 코드 처럼 마크업하려 했으나 필요없는 class를 만드는 것 같아서 netflixfooter에 padding 속성을 주기로 했다.
