css 관련 다시 질문 드리겠습니다
본문
높이값이 변경 되더라도 어떤 기준되는 class가 있으면 그 기준이 변경되더라도 기준에 맞춰서
같이 높이값이 변경되게 할려면 어떻게 해야하나요
class가 A1/ B1/C1 이 이따면
---A1 이게 높이변경
---B1 이게 C1가 같이 C1 위에 margin값을 줘서 20만큼 위에 있게하고싶고요
아니면 A1의 높이 값이 변경되더라도 변경된 위치값보다 20만큼 밑에 있게 하고 싶어요
---C1
왜냐면 C1은 A1의 높이값이 변경되더라도 C1은 자동적으로 A1 높이값만큼 자동으로 움직이던데
B1은 안움직이고 C1에 감춰지더라고요
답변 2
클래스값은 적용되는 순서에따라서 덮어씌워집니다.
<section class="A1 B1 C1"></section>이런식으로 여러개 적용이 될수있다는거죠~
그 중에 A1, B1, C1에 똑같이 margin속성이 있고 값이다르다면 C1의 속성을 따르게 됩니다.
하지만 A1, B1 같이 앞에 있는 녀석들의 속성값을 무조건 따르게 하고싶다고 하시면
margin:0 !important; 형태로 뒤에 !important를 붙이시면 순서에 상관없이 !important붙인 속성값이 적용되게 됩니다.
높이 값이 변경되더라도 기준에 맞추시길 원하신다면... 마지막 속성에 height:auto;로 주시면 높이값은 내용의 양에 따라서 변하겠지만,
margin값들은 적용되어서 위아래 간격이 자동으로 적용될거예요~
지금 보닌까 A1의 양이 6개면 기준 위치에 맞게 되는데
A1의 양이 3로 되면 양이 줄어들어 줄어든 높이만큼 C1이 올라옵니다
그러면 B1의 마진값이 먹은 상태에서 그 위치에 고정이 되어 C1이 올라오면 B1이 감춰집니다
C1에 B1이 마쳐서 C1이 올라가면 B1도 올라가고 C1이 내려가면 B1이 내려가게할수는없나요?
혹시 A1, B1, C1의 CSS 소스 첨부해주실수 있나요?
HTML 소스도 올려주시면 좋구요~
원인파악이 되어야하는데... 아무것도 없는상태에서 원인파악이 힘들겠죠~^^?
예 요소에서 벗어나있어서 우선 현재 사용하는데로 하고 만나시는분이있는데 그분 만나서 고쳐야겠어요 감사합니다 ㅋ
B1 클래스의 요소가 문서의 흐름에서 벗어나 있는건가요?
가령 positon: absolute 나 fixed 등으로?
