I’m not sure if anyone has more experience troubleshooting issues than I but the newest Chrome upgrade has created an issue where the 2nd and 3rd columns of our main submenus are not clickable. (photo below) www.dickinsonstate.edu The first columns works fine but not the other two. It is almost as if there is an invisible wall preventing the clicks from occurring though the text is still selectable. I’m not sure how the designers are wrapping the menu’s so that could be causing some issue as well. Any thoughts on how to fix this?
Disabling -webkit-column-count: 3; makes everything a single column again and the link works. Any ideas of why the columns would break the links?
I don’t think it’s related to CSS column-count or anything like that. We are having the same issue with the newest Chrome update (v66). I checked other browsers (Firefox, Safari, Opera, etc.) and all are working fine even Google Canary Chrome (v68), too.
I checked http://www.dickinsonstate.edu/ using Google Canary Chrome and it’s working fine.
EDIT: Ok it seems to be a bug related to webkit-column-count so I hope they’ll get this fixed ASAP.
Are you seeing similar link problems on your websites? Can you keep me posted if you find a solution?
It appears to be related just to the column count option as I tried a single column or even display:flex and both make the links work but look terrible. At first I though something was layered above the columns but the flex option makes it a single row and there are no issues there.
If you go to this page https://www.sfcollege.edu/hr/forms/ and click the links on the grey box. It doesn’t work.
Wow… this is terrible. It is nice to not be the only one experiencing the issue but I’m sure this is causing havoc on many websites.
I reported the issue to Google through their version bug report system. That could take some time to address I’m sure.
I found that if I removed both position: relative; styles from
.perc-file-auto-list .perc-list-main .perc-list-element {
position: relative;
}
sf.css:4
.perc-file-auto-list .perc-list-main .perc-list-element {
position: relative;
}
That resolved the issue on the SantaFe page. Checking if that will work for yours Josh.
-n
I’m not finding those in any Percussion CSS, that is the SantaFe custom CSS correct? I’m not finding anything similar in ours. I’m probably missing something obvious.
That’s crazy… I removed the via web inspector but wondered why that happened. The Google Canary worked fine even with position: relative in there. I think I will wait till the next update fix this. position: relative
Anyone else have any ideas? Things are still broke on our end 
Hi Josh,
Try getting rid of -webkit-backface-visibility: hidden; (in your main.css) when I remove that from the applied classes on your home page (via Chrome Developer Tools) to the nav li’s the multi column links started working again. In both cases Aaron’s case and yours this is custom css.
-n
Thank you Nate for letting us know. I took a quick glance what “visibility” means (https://www.w3schools.com/cssref/css3_pr_backface-visibility.asp). I guess it’s safe to remove it. I will run a test to ensure all is good. Thank you.
That seemed to remedy the issue, I reverted back until the design company can confirm it doesn’t break anything major on the rest of the website.
Thanks!
