How to fix the position of a button for a div

Question

I am trying to fixed the button by declaring the position: Fixed; but it works for whole page. Is there any solution so the the button be fixed for a div with its height:200px . What I am trying to do is the button which is fixed for its parent's div height. Any help are surely appretiated.

I have done like this

    <div style="Height:200px; width:45%;">
      <div style="position:fixed; top:100px; left:253px;">
             <asp:Button ID="ReplyEventButton" runat="server" Text="Reply to this Ad"  />
      </div>
    </div>

Answer 1

Use position: absolute instead of fixed . Your parent div needs to have position: relative .

<div style="height:200px; width:45%; position:relative;">
  <div style="position: absolute; top:100px; left:253px;">
         <asp:Button ID="ReplyEventButton" runat="server" Text="Reply to this Ad"  />
  </div>
</div>

Answer 2

Are you wanting the button to be positioned relative to its containing div, but slightly offset?

If this is what you are asking for, then try the following:

<div style="height: 200px; width: 45%;">
  <div style="margin-top: 100px; margin-left: 253px;">
     <asp:Button ID="ReplyEventButton" runat="server" Text="Reply to this Ad"  />
  </div>
</div>

This offsets the element without removing it from the page flow.

If you are wanting it to be detached from the flow of the page, then follow easwee's advice of using a relative parent and absolute child.

Hope this helps.

Answer 3

Try something like this:

<div style="position: relative; Height:200px; width:45%;">
  <div style="position: absolute; top:100px; left:253px;">
         <asp:Button ID="ReplyEventButton" runat="server" Text="Reply to this Ad"  />
  </div>
</div>