'Antd Sidebar Height Responsive in ReactJs

So I am working with antd Sider and Menu trying to create a Sidebar with responsive height. I have researched alot of it and tries some solutions but none of them worked. Solutions I have tried: setting minHieght of sider to 100vh setting minHieght of layout to 100vh using percentages to define height in above cases also tried to give menu height of 100vh

I have attached Screenshots for the code Current View of sidebar,Sidebas.js, Sidebar.scss, Page I want to call this component

Current View

Sidebr.js

Sidebar.scss

File in which component is called

reactjsantdsidebar


Solution 1:[1]

You should get this class names for your changes.

ant-menu ant-menu-root

enter image description here

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 BIRKAN

Related Questions

React Router with optional path parameter

react-dropzone: isDragReject is true when accept csv?

React: Perform action, only once, when html element is clicked

How do you re-render DatePicker with updated defaultValue?

React-Native-Maps not showing on Android Emulator or real device

Having services in React application

Recommendations to get React input test

Recommendations to get React input test

Webpack 5 & Jest - Property 'toBeInTheDocument' does not exist on type 'JestMatchers<HTMLElement>'

Webpack 5 & Jest - Property 'toBeInTheDocument' does not exist on type 'JestMatchers<HTMLElement>'

Mui-datatables Material-UI: the page prop of a TablePagination is out of range

react router's location state becomes undefined on change of route

Using webpack to load CSS files from node modules

react-number-format: Setting Default Value

You cannot render a <Router> inside another <Router>. You should never have more than one in your app