2 elements in header: <nav> + <div>. Can I perfectly center the nav or it will be slightly off?
Does Inspect Tool allow me to check if something is perfectly centered?
Working on a project and it feels that the nav is not centered despite going margin auto.
I've no clue where to post NEXT files, so I just recreated it on codepen:
Codepen: https://codepen.io/NotNegative/pen/LENpmOb
4 Replies
Could be my eyes, but it feels like it's slightly off to left.
Is there another way beside margin auto to actually center or am I doing something wrong?
It's off to the left because the language selection is taking up space on the right, and the
margin: auto only centers it within the remaining space.
There are several possible approaches if you want the nav to be fully centered in the viewport despite having a sibling to the side. Here is a robust option using CSS Grid demonstrated in a CodePen:
https://codepen.io/alec-mitnik/pen/KwpEYVOThanks a lot for the help!