CODEWITHSUNDEEP
htmlcss
Thamaraiselvam
Thamaraiselvam

Reputation: 7080

Button does not work properly

  1. I'm using button with position:fixed. If I hover mouse, it changes as a hand symbol when after scrolled it does not hover.

  2. Before scrolling hover works at center of the button not at edges.

    <form action="response.php">
    <button style=" position:fixed;" >Get Your Result </button>
</form>

default position i bring mouse into center of button it works
enter image description here

same default position hover is not working even mouse cursor on buttonenter image description here

finally i scrolled after hover entirely gets disabled

enter image description here

Upvotes: 2

Views: 1374

Answers (5)

Venkata Krishna
Venkata Krishna

Reputation: 1776

Try adding z-index property to your button.
This might be happening because on scroll, your button might be having any other element overlapping it.
FYI: In z-index, elements with higher z-index value comes in front.

Upvotes: 3

Dileep
Dileep

Reputation: 515

Are you looking something like this:

 <body>
   <form action="response.php">
     <button type="button" style=" position:fixed;" >Get Your Result </button>
   </form>
 </body>

styles

  button:hover{
    background-color: red;
    cursor: pointer;
  }
  body{
    height: 2000px;
  }

Upvotes: 1

I&#39;m Geeker
I&#39;m Geeker

Reputation: 4637

Use this

<form action="response.php">
    <button type="submit" style=" position:fixed;cursor:pointer;" >Get Your Result </button>
</form>

Upvotes: 1

ketan
ketan

Reputation: 19341

I think here works what you want:

<form action="response.php" style="min-height:800px;">
    <button style=" position:fixed; cursor:pointer;" >Get Your Result </button>
</form>

Check Fiddle

Upvotes: 1

Ram kumar
Ram kumar

Reputation: 3162

I think need to set button type Like this

<button type="submit" style=" position:fixed;" >Get Your Result </button>

Upvotes: 1

Related Questions