Metronic Mega Update!Tailwind 4, React 19, Next.js 15, KtUI, ReUI, eCommerce, User Management Apps and more
Explore Update

The side menu does not work when running from a mobile device ReactJs ver 8.1.9


side menu does not work when running from a mobile device and also have scroll bar not appear some cases .I think issue related with fixed height. I just tried following way on SidebarMenu component

<div
style={{overflowY: 'scroll',height:580}}
className='menu menu-column menu-rounded menu-sub-indention px-3 dynamic-menu'
id='#kt_app_sidebar_menu'
data-kt-menu='true'
data-kt-menu-expand='false'
>
its working on larger screen devices.


Text formatting options
Submit
Here's a how to add some HTML formatting to your comment:
  • <pre></pre> for JS codes block
  • <pre lang="html"></pre> for HTML code block
  • <pre lang="scss"></pre> for SCSS code block
  • <pre lang="php"></pre> for PHP code block
  • <code></code> for single line of code
  • <strong></strong> to make things bold
  • <em></em> to emphasize
  • <ul><li></li></ul>  to make list
  • <ol><li></li></ol>  to make ordered list
  • <h3></h3> to make headings
  • <a></a> for links
  • <img> to paste in an image
  • <blockquote></blockquote> to quote somebody
  • happy  :)
  • shocked  :|
  • sad  :(

Replies (39)


Ensure that your sidebar menu component is designed to be responsive, meaning it adapts to different screen sizes and orientations. You may need to adjust the styling and layout of the menu to better accommodate smaller screens. By addressing these considerations and implementing responsive design techniques, you can improve the functionality and usability of the sidebar menu on mobile devices in your React.js application.


kim h. - Sydney food truck



Hi,

Thank you for reaching out to us.

Can you let us know which demo you are using?

Please be aware that on the mobile version, you need to tap the sidebar toggle button in the mobile header to view the sidebar.

Regards,
Lauris Stepanovs,
Keenthemes Support Team


Text formatting options
Submit
Here's a how to add some HTML formatting to your comment:
  • <pre></pre> for JS codes block
  • <pre lang="html"></pre> for HTML code block
  • <pre lang="scss"></pre> for SCSS code block
  • <pre lang="php"></pre> for PHP code block
  • <code></code> for single line of code
  • <strong></strong> to make things bold
  • <em></em> to emphasize
  • <ul><li></li></ul>  to make list
  • <ol><li></li></ol>  to make ordered list
  • <h3></h3> to make headings
  • <a></a> for links
  • <img> to paste in an image
  • <blockquote></blockquote> to quote somebody
  • happy  :)
  • shocked  :|
  • sad  :(
Text formatting options
Submit
Here's a how to add some HTML formatting to your comment:
  • <pre></pre> for JS codes block
  • <pre lang="html"></pre> for HTML code block
  • <pre lang="scss"></pre> for SCSS code block
  • <pre lang="php"></pre> for PHP code block
  • <code></code> for single line of code
  • <strong></strong> to make things bold
  • <em></em> to emphasize
  • <ul><li></li></ul>  to make list
  • <ol><li></li></ol>  to make ordered list
  • <h3></h3> to make headings
  • <a></a> for links
  • <img> to paste in an image
  • <blockquote></blockquote> to quote somebody
  • happy  :)
  • shocked  :|
  • sad  :(