[openstreetmap/openstreetmap-website] Use flex container instead of floats in header (PR #4296)

[Andy Allan]

@gravitystorm requested changes on this pull request.

Thanks @AntonKhorev , I definitely want to get rid of all of the floats.

However, in this PR the menus aren't working for me when I change the window size. For example, everything is fine at wide screen widths:

![Screen Shot 2023-11-15 at 15 51 45](https://github.com/openstreetmap/openstreetmap-website/assets/360803/5d52070d-98bf-43ba-bd8a-3f8ecad5d32c)

Then as the screen is narrowed there is a positioning error:

![Screen Shot 2023-11-15 at 15 52 05](https://github.com/openstreetmap/openstreetmap-website/assets/360803/5de3e368-268b-4272-993b-6a0f98206f72)

Then slightly narrower it looks OK again:

![Screen Shot 2023-11-15 at 15 52 10](https://github.com/openstreetmap/openstreetmap-website/assets/360803/1fdf5d23-37a3-481f-9f99-1d598ac41041)

Then during the next transition there is also an error:

![Screen Shot 2023-11-15 at 15 52 16](https://github.com/openstreetmap/openstreetmap-website/assets/360803/e3cb11f7-c53d-4916-ae99-5a71377a498d)

Then it looks OK again:

![Screen Shot 2023-11-15 at 15 52 23](https://github.com/openstreetmap/openstreetmap-website/assets/360803/ceb8718a-d1ec-412e-8fb2-dcc1827e4252)

Other notes:
* The same errors are shown as the width increases (vs decreases)
* The same errors are shown when refreshing the page at the given error width
* UA: Firefox 119.0.1 (Ubuntu)
* If there's some way to avoid the absolute positioning (of the menu icon in small-nav mode) that would be great. Perhaps it can be positioned using flex too?



-- 
Reply to this email directly or view it on GitHub:
https://github.com/openstreetmap/openstreetmap-website/pull/4296#pullrequestreview-1732380679
You are receiving this because you are subscribed to this thread.

Message ID: <openstreetmap/openstreetmap-website/pull/4296/review/1732380679 at github.com>
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://lists.openstreetmap.org/pipermail/rails-dev/attachments/20231115/3f00cd14/attachment.htm>