외부 DIV가 상대적으로 배치되지 않은 경우 Overflow:hidden이 절대적으로 배치된 내부 DIV에서 작동하지 않는 이유는 무엇입니까?

오버플로 숨김 및 절대 위치 지정

외부 DIV에 오버플로가 있는 중첩된 DIV가 있는 시나리오에서: 숨겨진 속성 및 내부 DIV 절대적으로 배치되면 내부 DIV는 외부 DIV의 오버플로 제약 조건을 준수하지 않을 수 있습니다. 이는 외부 DIV가 절대적으로 위치하지 않을 때 발생합니다. 외부 DIV를 위치: 절대값으로 변경하면 전체 레이아웃이 중단될 수 있습니다.

테이블 셀 내에서 내부 DIV의 원하는 위치를 유지하면서 이 문제를 해결하려면 다른 접근 방식을 사용할 수 있습니다.

1. 외부 DIV를 상대 위치로 설정합니다. 이는 내부 DIV에 대한 새로운 좌표계를 설정합니다.
2. 내부 DIV의 위치를 ​​위치: 절대로 변경합니다. 이렇게 하면 가장 가까운 위치의 조상을 기준으로 내부 DIV의 위치가 지정됩니다. 이 경우 외부 DIV는

예:

#first {
    width: 200px;
    height: 200px;
    background-color: green;
    position: relative;
}

#second {
    width: 50px;
    height: 400px;
    background-color: red;
    position: absolute;
    left: 0px;
    top: 0px;
}

이 조정을 통해 이제 외부 DIV의 Overflow:hidden 속성이 내부 DIV를 적절하게 제한하여 내용이 외부 DIV의 경계를 넘어 확장되는 것을 방지합니다. DIV. 또한 이 솔루션을 사용하면 내부 DIV가 의도한 대로 테이블 셀 외부로 성장할 수 있습니다.

위 내용은 외부 DIV가 상대적으로 배치되지 않은 경우 Overflow:hidden이 절대적으로 배치된 내부 DIV에서 작동하지 않는 이유는 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!