CODEWITHSUNDEEP
csshyperlinkmouse-cursor
Craig van Tonder
Craig van Tonder

Reputation: 7687

Is it possible to remove the hand cursor that appears when hovering over a link? (or keep it set as the normal pointer)

I would like to remove the hand cursor that appears when you hover over a hyperlink.

I have tried this css:

a.link {
    cursor: pointer;
}

And this:

a.link {
    cursor: pointer !important;
}

And still it changes to the hand when I hover over the link.

Does anyone have any ideas as to why this happens or a solution that would enable me to achieve this effect?

Upvotes: 83

Views: 200823

Answers (5)

Crystalline Core
Crystalline Core

Reputation: 708

<style>
a{
cursor: default;
}
</style>

In the above code [cursor:default] is used. Default is the usual arrow cursor that appears.

And if you use [cursor: pointer] then you can access to the hand like cursor that appears when you hover over a link.

To know more about cursors and their appearance click the below link: https://www.w3schools.com/cssref/pr_class_cursor.asp

Upvotes: 3

Anil Kumar Reddy
Anil Kumar Reddy

Reputation: 137

Try this

To Remove Hand Cursor

a.link {
    cursor: default;
}

Upvotes: 5

jagadish
jagadish

Reputation: 51

<button>
  <a href="https://accounts.google.com/ServiceLogin?continue=http%3A%2F%2Fmail.google.com%2Fmail%2F%3Fpc%3Den-ha-apac-in-bk-refresh14&service=mail&dsh=-3966619600017513905"
     style="cursor:default">sign in</a>
</button>

Upvotes: 5

jacktheripper
jacktheripper

Reputation: 14219

Using inline styling use <a href="your link here" style="cursor:default">your content here</a>. See this example

Alternatively use css. See this example.

This solution is cross-browser compatible.

Upvotes: 17

bevacqua
bevacqua

Reputation: 48496

That's exactly what cursor: pointer; is supposed to do.

If you want the cursor to remain normal, you should be using cursor: default

Upvotes: 187

Related Questions