I have a small menu div that i would like to keep in the top right corner of a page even if the content is scrolled. I have it working in terms of the vertical positioning, but for some reason the horizontal positioning is going to the left instead of the right.
Here’s the div. I’ll put the style elements in a stylesheet once the styling is complete.
<div style="position: fixed; top: 62px; right: 2px; width: 80px; height: 150px; border-radius: 15px;">
It is inside the following:
<div class="backg">
<div id="main">
<%= yield %>
<%= yield :javascript%>
<div class="notice_alert">
<%= notice %>
<%= alert %>
</div>
</div>
</div>
From the stylesheet used by divs that would contain the menu:
.backg { background: url(../images/bkgd_body.gif) 0 0px repeat-x !important; }
#main { position: static; width: 90%; margin-left: auto; margin-right: auto; margin-top: 60px; }
I removed all style elements for #main and removed the backg div. It was still on the left side.
When i put the div right after the body tag in the Rails layout file it was still on the left side. Nuts!
This is happening in Safari. I tested Firefox and Chrome and it was still on the left side for both of those browsers as well.
Thanks.
try putting the above mentioned code just below where body tag starts.
like