기본적으로 여러 섹션(파란색)을 포함할 수 있는 사이드바가 있으며 각 섹션은 켜거나 끌 수 있고 여러 항목(빨간색)을 포함할 수 있습니다. 열 때 확장된 요소가 다른 파란색 부분을 테두리 밖으로 밀어내는 것이 아니라 테두리 밖으로 밀어내고 확장된 부분에서 오버플로 y 스크롤을 수행하기를 원합니다. 다음은 모양(1)과 모양(2)에 대한 스크린샷입니다.
사용된 코드는 다음과 같습니다.
<스타일> .h-96{ 높이: 24rem; } .w-52{ 폭: 13rem; } .오버플로 숨김{ 오버플로: 숨김; } .bg-블랙{ 배경색: rgb(0 0 0); } .w-전체{ 너비:100%; } .국경{ 테두리 너비: 1px; } .border-black{ 테두리 색상: rgb(0 0 0); } .bg-블루-500{ 배경색: rgb(59 130 246); } .h-fit{ 높이: 적합 콘텐츠; } .space-y-1{ 여백 상단: 0.25rem; } .overflow-y-scroll{overflow-y: 스크롤;} .h-10{높이: 2.5rem;} .bg-red-500{배경색: rgb(239 68 68);} .h-20{높이: 5rem;} .h-[100px]{ 높이:100px; }제공하실 수 있는 도움에 미리 감사드립니다!
용기를 곡선으로 만들어 파란색 품목이 줄어드는 것을 방지할 수 있습니다.
flex flex-col
.shrink-0
.