:hover {curror: pointer} на круге, созданном с помощью borderradius, сделает его указателем даже за пределами круга

Я создал кнопку круга, используя радиус границы. Моя проблема заключается в том, что при использовании следующего кода : button:hover {cursor: pointer} курсор будет указателем даже за пределами круга (но внутри "прямоугольного div"). Я почти уверен, что мне нужен javascript, чтобы решить эту проблему (хотя я включил тег CSS на случай, если я ошибаюсь), но кроме этого я пуст, если кто-нибудь может указать мне правильное направление, это было бы здорово!

спасибо.