CSS: Gravity field, or how to align nav items around a centered logo
Fellow freelancer Brice came up with an interesting challenge the other day: center heterogeneous nav items around a centered logo.
After a bit of fiddling about I came up with a solution: relative gravity!
So, it’s not quite as far fetched as Einstein’s theory, but the idea is to use flexbox
order to split the nav items in two groups which we can then pull around the logo using negative margins… with a little voodoo… well, actually, that also is less far fetched, as it’s a simple
margin: auto set on the adequate element.
See the pen.