MadCap Software Forums

My website is built with the Side navigation template. For the past couple of weeks (possibly longer), the content has appeared strange in Chrome (at least version 134): the topic's text might appear bold when scrolling down the page. This issue does not occur in Firefox or Edge. The boldness can be temporarily removed by highlighting the text of the paragraph or by hovering the cursor over the TOC.

I've researched this extensively and found one potential reason for the problem: if the TOC is long enough to extend below the screen and a scroll bar appears, the text in these topics appears bold. I noticed that if I add the specification .sidenav-wrapper {overflow: hidden;} to the CSS file, the problem disappears because the scroll bar is not visible in the TOC (normally it has overflow: auto;). This, of course, makes the site unusable and does not provide a functional solution to fix the issue. The TOC has always been quite extensive, and the problem hadn't occurred before.

Another observation is that if I remove all images from the topic, then the problem does not occur in that topic, even if the TOC is long enough to have a scroll bar. So, the problem seems to occur only in topics that contain images and a menu with a visible scroll bar.

Can anyone suggest what I could do to eliminate the problem? The page content looks very unsightly when the text appearance suddenly changes.

I don't think I've made any changes to my CSS that could cause this problem. I also found a previous build of my website on my computer from a year ago, and this problem occurs there as well. I am quite certain that a year ago, the issue did not exist, and the text appeared normally in topics, so I assume something has changed in Chrome in the meantime.

Instructions to reproduce the problem (fullscreen, full HD display):

• Open my website, for example, this topic: https://help.inschool.fi/VAKA/fi/Viesti ... ominen.htm

• Click the "Laajenna ohje" button (this opens the drop-down headings) or manually open the headings one by one.

• Scroll down the page using the mouse wheel or by dragging the scroll bar.

• See how the text coming from "hidden" suddenly changes to bold. You can also scroll back to the top, and the text coming from "hidden" at the top turns bold.

Another example:

• Open this topic: https://help.inschool.fi/VAKA/fi/Viesti ... ttajat.htm (in this, the side menu is so short that it doesn't overflow the screen)

• Click the "Laajenna ohje" button (this opens the drop-down headings) or manually open the headings one by one.

• Scroll down the page using the mouse wheel or by dragging the scroll bar.

• The text remains normal.

• However, if you reduce the browser window vertically so that the TOC gets a scroll bar, the bolding issue reappears when scrolling.

I appreciate any help, thank you in advance.

I just gave it a go and I'm not seeing the bold effect. Sorry I can't be any help. Chrome 134 and 135.

I had a play on Friday but although I could see the problem (Chrome 134) I couldn't come up with a reason for the emboldening. I could get the behaviour to repeat even on the topic you said didn't do it. If you play with the dimensions of your browser window you can see the same behaviour for the same reason.

Thought it might be something to do with an edge case with screen font size, monitor resolution, zoom level (chrome or windows), but couldn't come up with a viable cause. Perhaps also something to do with css and differences in the break points for tablet/monitor/phone widths? Nothing changes in the Chrome Inspector so I can't point to anything there. It does seem tied to the scrollbar in the TOC, though why that should be doesn't make sense to me. I'd suspect a conflict of styles somewhere but debugging may be tricky. Perhaps changing the overall font size for those sections might be a start, see if that makes a difference.

It might pay to make a copy of the system and try with a clean and basic CSS, then add things back in until you see the issue. Yeah, sorry that does sound like a complete pain to do.

Rob