I am using react slick to make a slider, the slider card contains a drop-down menu with many options. When the dropdown is open, half of the dropdown is cropped and the full dropdown cannot be viewed.
Codepen: https://codepen.io/gtm18/pen/YzRdaML (demo with jQuery)
$(document).ready(function(){ $('.carousel').slick({ slidesToShow: 3, dots:true, centerMode: true, }); });
![[Web front-end] Node.js quick start](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
You can limit the height of the drop-down menu, which will add a scroll bar and you can see all the options, like this:
.dropdown-content { display: none; position: absolute; background-color: #f6f6f6; min-width: 230px; overflow: auto; border: 1px solid #ddd; z-index: 1; max-height: 240px; }To see a more detailed demo, check out this code demo:
https://codepen.io/gtm18/pen/YzRdaML