Solution was to addtouch-action: auto !important; to the CSS!

Hi! I am the webmaster for my wordpress site, fusil.uk.

(Can also be viewed on some lemmy instances! [email protected] and my other account is @[email protected])

I have been trying to fix a problem where text links within anchor tags aren’t clickable on mobile. If I set the browser to responsive mode on chromium, they aren’t clickable either, regardless of resolution.

I have been trying to adjust anchor tags z indexes, checked several times to see if there were overlapping divs, etc, and yet to find a solution. It also affects my sub pages.

The closest I have gotten is that deleting the global-styles-inline-css fixes the problem, but obviously ruins the graphical aspect of my site. Changing the style doesn’t fix it, but changing the entire theme does. Obviously, I want my theme to work.

Hovering over the link in responsive mode on the browser shows the url interestingly, but clicking has no effect.

My parent theme is twentytwentyfour and it should be up to date.

Any help is appreciated! Thank you!

  • @SomethingBlack
    1•2 days ago

    Difficult to say without seeing the HTML and CSS you’ve mentioned. My first guess was that it could be “pointer-events: none” was the cause but I believe that would stop the URL hover too, so not likely to be that.

    I’m not too sure of your experience in non-wordpress web dev so I apologise if this is a stupid question, but have you inspected the html in browser? You’d likely get a much clearer idea of what’s going on under the hood and could inform a fix

    • @[email protected]OPEnglish
      2•2 days ago

      Thanks for your response! I’ve done quite a bit of sitting on inspect element, I don’t believe there is anything affecting pointer events or touch events, as I cannot see anything there, unless there’s something I should add to enable them?

      I believe if it is an issue, it would be touch-action that needs to be acted upon, I’ll take a look now

      Edit: seems that adding touch-action: auto !important to the anchor css did the trick! Thank you for pointing me in the right direction!