Prerequisites

• I have searched for duplicate or closed feature requests
• I have read the contributing guidelines

Proposal

I've seen
#11653
... seems the same issue with the latest 5.3.x release.

Would be great if this is (somehow) a part of the library. Just close the collapsible element on any type of resize event.

I need to add to my code this fix to make it working.

const menu = document.getElementById('menu');
window.addEventListener('resize', () => {
if (menu?.classList.contains('show')) {
bootstrap.Collapse.getOrCreateInstance(menu).hide();
}
});

Motivation and context

Would be great if the suggested event listener is registered directly by Bootstrap js. Without it: if you open menu on a smaller screen and then resize the window (well, I know it is an edge case, but as a website creator I care about details), expanded nav items keep formatting of the shown collapsed menu which might be different - for example nav items might have a border.

I'm attaching few screenshots: in shown collapse menu items have (intended) dotted border (first screenshot), then resizing - expanded menu keeps items with dotted border which is not expected nor wanted (second screenshot), last screenshot shows desired behavior. It should be trivial to reproduce.