본문 바로가기
반응형

Cascading2

css cascading 안되는 경우 정규직 전환이 되기 전, 인턴초반에 문제가 생길때마다 팀장님한테 많이 여쭤보았었다. (지금은 이직하신..) 그때 팀장님께서 알려주신 것 중에 cascading이 있다. 당연하다고 생각했지만 명확하게 알지 못하면 관련해서 문제가 생겼을때 원인 파악이 어려울수도 있는 내용이었다. 위와 같이 wrapper에서 color를 지정하면 button에서 당연히 color가 캐스캐이딩 될 것이라 생각했다. 그런데 그렇지 않았다! 처음에는 다른 엘리먼트에 의해 막힌줄 알고 개발자도구를 살펴보았다. 하지만 아무 이유 없이 color:white 가 취소된 상태였다. 혹시 몰라 button태그를 div태그로 바꾸니 cascading이 잘 되었다. 이번 상황을 통해 전혀 몰랐던 것을 알게 되었다. 모든 속성을 부모 엘리먼트로부.. 2022. 11. 6.
*{}와 Cascading 쉬운 내용이라 생각했는데, 또 실제로 써먹는건 전혀 다른 문제인것 같다. 오늘 코드리뷰때 설명들은 내용이라 기록 배경: 과거에 작성된 *{}로 생긴 사이드이펙트를 해결하는 과정에서 효율적으로 해결하고자 코드리뷰때 스몰톡 요청 !important 로 해결하면 한방에 끝나지만, 이는 또다른 레거시를 만든다고 생각했음. (요새 읽고 있는 '소프트웨어 장인' 이 한 몫 했다.) 설명을 들으면서 아주 간단한 방법을 안내 받았고 이를 캐스케이딩이라 부른다는 것을 알게 되었다. 아주 쉬운 방법을 떠올리지 못하고, 막상 실전에선 이상한 복잡한 방법들을 쓰게 된다. 이런데서 실력차이가 나는듯 캐스케이딩이 뭘까? 밑에 설명 * { } 해당 태그안의 모든 태그에 싹 다 표현된다. * { 별표 스타일은 캐스 케이딩이 아니라 .. 2022. 3. 9.
반응형