Kaydırma çubuğu görüntülendiğinde içeriğin daralmasını önleme

Question

Kullanıcı DIV'yi kaydettiğinde kaydırma çubuğu gösteriyorum. Benim sorunum, kaydırma çubuğu göründüğünde içeriğin daralması.

Aradığım şeyi görmek için YouTube'un menüsüne (masaüstü web sitesi) bir göz atın.

Bu, örnek bir kod ve çalışmakta olduğunu görmek için link to codepen'dur. İşte

.scrollable{ 
    width: 400px; 
    height: 400px; 
    margin: 12px auto; 
    border: solid 1px black; 
    overflow: hidden; 
    &:hover{ 
     overflow-y: auto; 
    } 
} 

.content{ 
    margin: 0 auto; 
    width: 300px; 
    height: auto; 
} 

Answer 1

:

.scrollable{ 
    width: 400px; 
    height: 400px; 
    margin: 12px auto; 
    border: solid 1px black; 
    overflow: hidden; 
    &:hover{ 
     overflow-y: scroll; 
    } 

}

Sadece bu içerik hareket etmeyecek şekilde vurgulu üzerinde overflow-y: scroll belirlemek zorunda.