Use 50% Discount for all private proxies!
Unlimited possibilities with ExtraProxies

Appling overflow:auto to the parent div ,affecting the ul element(child) width

I have a parent div inside that we have a ul element as a child.

please find the css code below:

#mainmenu {     float: left;     display: block;     position: sticky;     left: auto;     z-index: 950;     -webkit-user-select: none;     user-select: none;     min-height: 100vh;     max-height: 100%;     background: black;     width: 50px; } #mainmenu input:checked ~ ul {     transform: none;     background: black;     margin-left: 49px;     visibility: visible;     height: 100%; }  #menu {     visibility: hidden;     z-index: 99;     white-space: nowrap;     margin-top: -18px;     position: absolute;     width: 300px;     padding: 0px 25px 0px 0px;     background: white;     list-style-type: none;     -webkit-font-smoothing: antialiased;     transform-origin: 0% 0%;     transform: translate(-100%, 0);     transition: transform 0s cubic-bezier(0.77, 0.2, 0.05, 1); } 

please find the below HTML code for references:

<div id="mainmenu" class="parentmenu"  style="min-height: 831px;max-height: 831px;overflow-y: auto;overflow-x: hidden;> <ul id="menu"> <li></li> </ul> </div> 

The parent div(mainmenu)has 50px width and child (menu)has 300px width,by default parent div will be visible all times and once clicking on the menu icon the child (ul) element will be shown.

I need to add overflow-y:auto,because the ul elements will be binded dynamically. when i am applying overflow to the parent div(mainmenu),it is affecting the width of the child(menu)element.

please check the images below for better understanding. enter image description here

enter image description here

I tried by applying different css properties but nothing worked the same issue is being repeated

Expected Result should be: The child element should show as first image by adding scroll to it and there should not be any affect on child element width.

Related Posts
DreamProxies 100 Proxies 200 Proxies 400 Proxies 1000 Proxies 2000 Proxies 5000 Proxies 10000 Proxies