Ul/li menu not centering in mobile view

HTML-CSS
#1

For several hours, the last couple of days, I’ve been trying to center a menu containing only 4 elements.

I’ve searched the web far and wide, and tried many different “solutions”, but none of
them seems to work well in mobile view (the smallest width:280px). Every time the result is the menu becoming around 20-70px right or left from the center.

Since the menu is only 4 elements, I would love to keep it similar to the desktop view, and not e.x. change it into hamburger style.

Anyone who has experienced the same kind of challenge who can enlighten me?

#2

Hello, welcome to the forum.

Since you didn’t include a codepen or any code, I’m going to guess.

If your menu is unordered links, they have default padding on the left. If you set padding-left to 0, that may help.

If that’s not it, you can share a codepen so people can take a look.

1 Like
#3

Thanks allot cherylm.

I made myself a test document, checking out the different style options on the ul/li elements. And your suggestion was very helpful! :slight_smile: