오버플로 스크롤 오버플로 숨김이 있습니다.

Question

div 스크롤 가능한 내용이 있고 그 헤더에 부모를 오버플로해야합니다. 오버 플로우 : 스크롤이 요소에 overflow : hidden을 추가하는 것으로 보입니다.
내가 도와 주시면 감사하겠습니다. 감사!

html로 :

<div class="container"> 
    <div class="problem">This is hidden</div> 
    <p>Content</p> 
    <p>Content</p> 
    <p>Content</p> 
    <p>Content</p> 
    <p>Content</p> 
    <p>Content</p> 
    <p>Content</p> 
    <p>Content</p> 
    <p>Content</p> 
    <p>Content</p> 
    <p>Content</p> 
    <p>Content</p> 
</div> 

<div class="container container-2"> 
    <div class="problem">This is what i want, but scrollable.</div> 
    <p>Content</p> 
    <p>Content</p> 
    <p>Content</p> 
    <p>Content</p> 
    <p>Content</p> 
    <p>Content</p> 
    <p>Content</p> 
    <p>Content</p> 
</div> 

CSS의 :

.container { 
    width: 230px; 
    height: 200px; 
    background-color: #eeeeee; 
    overflow-y: scroll; 
    margin-top: 30px; 
    margin-left: 30px; 
    float: left; 
} 

.container-2 { 
    overflow-y: visible; 
} 

.problem { 
    width: 235px; 
    height: 30px; 
    background-color: #33CCFF; 
    margin-left: -20px; 
    margin-top: 15px; 
} 

Answer 1

.problem { 
    width: 235px; 
    height: 30px; 
    background-color: #33CCFF; 
    /*margin-left: -20px;*/ //this is the cause of problem comment this 
    margin-top: 15px; 
} 

Demo Fiddle