How to put a dropdown within a grid?

Hallo. Once again I’m looking for your help. I’ve created a responsive navbar using grid. The items are aligned to the right on large screens and packed into a toggled menu button on mobile devices, also to the right. When the button is clicked, the menu is displayed vertically beneath the button. So far, so good.

However (of course), the whole grid is displayed and so the navbar with its background color is expanded by the size of the contents of the menu. I’d prefer just to have the items drop down underneath the button without the navbar being expanded.

Could someone give me a tip, in which direction I could go? Or is this not possible within a grid?

Hi world. I’m surprised. 17 views but no comment or answer. Was it badly written, ununderstandable? Or is the question too ridiculous?
I’ve spent the best part of today tinkering around, but haven’t found a solution. I have, however, learnt lot, which is why I’m doing it still. But I’m slowly getting near to the ef-you-see-kay-it border! Then I’ll just give up and go on to the next challenge.
Thanks for any comments you might have. Sorry if my tone sounds a little exacerbated or reproachful , don’t mean it like that, just getting frustrated - something all learners go through, I guess. (below my original text):

Hallo. Once again I’m looking for your help. I’ve created a responsive navbar using grid. The items are aligned to the right on large screens and packed into a toggled menu button on mobile devices, also to the right. When the button is clicked, the menu is displayed vertically beneath the button. So far, so good.

However (of course), the whole grid is displayed and so the navbar with its background color is expanded by the size of the contents of the menu. I’d prefer just to have the items drop down underneath the button without the navbar being expanded.

Could someone give me a tip, in which direction I could go? Or is this not possible within a grid?

would you be able to post your code?

As @ricardomg92 said, no one is answering because we can’t see what you’ve done and thus we really don’t know how to help you.

Sorry.
https://codepen.io/nick-butcher/pen/OJmyobQ
Request refers to mobile view.

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.