[inteoryx]

Two possibilities.

Someone else mentioned that their ad/tracking protection was causing a problem. I can only guess that this is blocking my attempt to embed tweets in the quiz. If this is the case I'd expect none of the tweets in the quiz to load.

Another possibility is a bug I neglected to fix before posting. Some of the tweets have since been deleted and if the quiz tries to load one of the deleted tweets it will retry but could fail and leave it in a bad state. If this is the case I'd expect 1 or more but not all of the tweets in the quiz to fail to load.

[thaumasiotes]

In Chrome, tweets are loading for the second quiz, but not for the first quiz. (In Firefox, with ad blocking, nothing loads.)

Also on both browsers, your text is not staying entirely within the browser window. I have the options of guessing the missing text, or, if I really care, highlighting, copying, and pasting into Notepad.

There is no horizontal scrollbar.

[inteoryx]

Hmm. That is odd, and not behavior I see in either Firefox or Chrome. I'm afraid my knowledge of CSS is insufficient to explain why that might be happening.

What OS are you using? What ad blocker?

[thaumasiotes]

Windows 10; uBlock Origin 1.35.2 in Firefox; I don't believe any Chrome addons are installed.

On this attempt, I got tweets in both quizzes in Chrome. (Still nothing in Firefox.) The Chrome tweets take a long time to load.

Bad text layout also occurs in Edge, which definitely doesn't have addons installed.

[inteoryx]

Thanks for letting me know and the details. I will look into it and correct it if I am able.

[thaumasiotes]

Some results (on the text layout):

Widening my window reveals the hidden text. If I continue widening it, the .mainContentColumn will grow wider and the text within will reflow appropriately. But the .mainContentColumn will never shrink below 1349 pixels wide, and if the window is narrower than that, the text will still lay out in the wider space, which hides some of the text.

The "Shukriya" image is 1349 pixels [1] wide, which is probably setting the minimum width of the .mainContentColumn.

You have `width: 100vw` set on the .mainContentColumn, but I'm guessing the width of the picture is interfering with that. If I set `width: 100vw` on .text, text layout improves (though clipping is still present). If I set `width: 90vw`, text layout flows appropriately within the new narrower and entirely-visible box.

However, giving this different width to the .text paragraphs means that the tweet embeds and titles are no longer centered relative to the text (they're centered relative to the .mainContentColumn, but the text is narrower than that and left-justified).

[1] Some type of scaling appears to be going on; if I screenshot my browser, clipping the image, the screenshot is over 2000 pixels wide.

[inteoryx]

Thanks so much. You've really gone above and beyond with this comment. I very much appreciate it. I've made a couple tweaks that may resolve the issue. If you have a chance to take another look I'd love to know if it is or isn't working for you.

Thanks again! Super helpful.

[BugsJustFindMe]

One of AdGuard's "annoyances" filters in Safari blocks them.

[inteoryx]

Hmm, that's unfortunate. I had considered loading the tweets as images instead of actually embedding them. I hadn't realized ad/tracking protectors might block the tweets, or else that might have pushed me over the edge to using images instead.

[BugsJustFindMe]

The ever-expanding state of ad filters these days makes honest webpage development way too hard. I found out the other day that another web "annoyances" filter was erasing _buttons_ generated by streamlit.io (a python data visualization library for web). Like someone out there is doing something hostile and now I can't trust that an interface for showing a k-means plot of some data will work for people anymore.

[inteoryx]

The frustrations for honest webpage developers and users are but another casualty from the aggressive advertising industry.