Chromium based browser non clickable links

  • Unknown's avatar
    tenderlystrawberryfe02a42511 · Member ·

    I recently noticed an issue on my website where the links do not function on Microsoft Edge and Google Chrome on some computers, but not all. The main issue is that the entire domain is not clickable, so even when I try to get click to get into WordPress from my computer this doesn’t work. The strange thing is the inconsistency; it happens on some computers but not every computer and also that anything on WordPress does not work for this same reason. When I switch to Firefox this all goes away.

    I have tried a couple of things to change this, changing the CSS a little bit to prioritize clicks but I’m not tech savvy enough to get this to function perfectly on the website. (I also can’t test it because WordPress doesn’t work on the browsers I need to test it)

    Has anyone seen anything like this and have any thoughts on how to fix it? Thanks!

    The blog I need help with is: (visible only to logged in users)

  • astrickrodriguez · Staff ·

    Hi there!

    What you’re describing sounds exactly like an invisible layout overlay bug.

    You can see your links and the WordPress.com dashboard perfectly underneath, but when you go to click, you’re actually hitting that invisible layer instead.

    This explains all of the strange quirks you’re seeing:

    • Chrome and Edge run on the exact same underlying browser engine, so they handle web layouts the same way. Firefox uses a completely different engine, which is why it’s ignoring the invisible layer and letting you click through.
    • These invisible boxes usually stretch or contract depending on screen size and resolution. On a big monitor, it might sit off to the side, but on a smaller laptop screen, it might completely take over.

    How to fix it? In this case, since Firefox is working perfectly for you, use it to log into your WordPress.com dashboard so you can actually click around and make changes!

    The issue is almost always a floating layout element like a sticky header, a mobile menu wrapper, a pop-up, or a cookie banner that has its CSS layout settings stretching across the screen without proper boundaries.

    Try temporarily disabling any recent plugins you added for menus, popups, or banners to see if the links start working again in Chrome. If you recently added custom CSS to change a layout priority, try removing that temporarily too, as it might be stretching a container box over the whole page.

    Let us know if turning off a recent layout element or plugin does the trick!

  • Unknown's avatar
    tenderlystrawberryfe02a42511 · Member ·

    Hello @astrickrodriguez

    How would I go about testing these changes that are made. If I’m making the edits in Firefox but I want to test it in Chrome, but Chrome browser doesn’t work right? I want to ideally be able to test on a non-active (not the published) site so disabling plugins or changing active CSS would be difficult.

  • nigeljoy · Staff ·

    Hi there,

    It looks like your site is hosted with HostGator rather than here on WordPress.com, so it falls outside the scope of our forums — we’re only able to help with sites hosted directly on WordPress.com.

    That said, I took a quick look at https://www.ebatco.com/ and wasn’t able to reproduce the issue — the links on the page appeared to be clickable for me. Could you clarify which specific link(s) you’re finding non-clickable, and on which page? That would help narrow things down.

    In the meantime, here’s a useful troubleshooting approach for issues like this:

    Use Chrome’s Element Inspector to find the culprit:
    As mentioned earlier, non-clickable links in Chromium-based browsers are often caused by an invisible or overlapping element sitting on top of the link (like a div with a higher z-index). You can identify it using Chrome DevTools:

    1. Right-click on the non-clickable link area and select Inspect.
    2. In the Elements panel, look at the element that gets highlighted — if it’s not the link you expected, that’s your overlapping element.
    3. Check the Styles pane on the right for CSS properties like position, z-index, width, or height on that element — these often reveal why it’s covering the link.

    Google’s official guide on selecting and inspecting elements walks through this in detail: https://developer.chrome.com/docs/devtools/css/reference#select

    Use Firefox as a workaround to access your Site Editor:
    If Chrome is giving you trouble interacting with your site, you can open your site in Firefox to access the WordPress editor and make any needed CSS or layout fixes from there.

    For further help troubleshooting, these are the best resources for your setup:

    1. WordPress.org Support Forums — designed for self-hosted WordPress sites like yours, with an active community that can help with theme or plugin conflicts: https://wordpress.org/support/
    2. HostGator Support — your hosting provider’s team can help investigate anything server-side: https://www.hostgator.com/help

    Feel free to share which exact links aren’t working for you, and we’re happy to take another look!

Log in or create an account to reply