Hamburger dropdown menu issue

How come I cannot change the size (width) of the icon I created?

codepen link

It looks like the min-width: 400 that you set for everything is the culprit. I’m not sure what you are trying to do with that, but with it removed the hamburger adjusts correctly, so I would remove it.

Oh. I see.

I’ve seen a lot of websites are behaving like this:

There is a minimum width I can reach when resizing my browser… like this template I saw online.

If you try to limits its width, you will find that the minimum width it has was 400px.
I am trying to clone this site…
Do you know any better idea how to set a minimum width to a site?

If you apply min-width to the body element, it will affect all the visible parts of the site, but it won’t override the specific widths you set to other elements in the page.

I see… but if I don’t set the body with min-width: 400px, how do I make sure that the whole page has a minimum width of 400px? Anything narrower than that won’t be shown?

I’m a little confused by your question…

Maybe I was confusing, too. What I meant is that you do set the body:

body { min-width: 400; }

What you were using before, *, is called the universal selector and it basically selects everything. So instead of saying “I want this webpage to stay this size or larger”, you were saying "I want this webpage and everything on it to be this size or larger.

1 Like

Oh… I see!
didn;t realise that that was the difference there!

Thank you so much!