Site and Docs Layout issues

[jonstelly]

The main site page text is rendering vertically for me in Firefox and Edge. The same issue shows up in the docs too. It looks like removing word-break: break-word from the h1, h2,... styles fixes both issues.

[adgray1]

We're not able to reproduce this in either browser (nor in other browser/device combinations we've tried so far). Are there any more details you might be able to provide? Just a few things that maybe could impact this:

1. OS
2. Browser version
3. Browser window size
4. Display resolution
5. Display pixel density
6. Browser developer settings configuration
7. Browser extensions which impact css of certain web pages

[jonstelly]

1. Windows 11
2. Firefox 104.0b8 (64-bit) and Edge 104.0.1293.47
3. 3440x1289
4. 3440x1440

I just tested and the issue starts at 1400px wide. In main.css there's a media selector for @media (min-width: 1400px). If I remove the following, the page and docs render like they do on a less-wide screen and everything looks good.

    article .row {
        flex-wrap: nowrap;
    }

[adgray1]

Thanks for the info. We'll have to keep an eye on this. The flex behavior there is intentional (when it works 😄), and at the moment unfortunately we're not able to reproduce it on the browsers/platforms we have readily available to investigate a proper fix.

I take it you don't have any browser extensions / browser developer settings locally that may impact this? Or at least none that come to mind?

[jonstelly]

Well that was unexpected... It was ultrawidify. I thought that extension was only on for youtube and a few other approved sites... I guess not. Thanks for the suggestion.

[adgray1]

Got it. Well good to know if anyone else visits our site and has the same or a similar extension enabled. So disabling ultrawidify resolves the issue?

[jonstelly]

yep!