Question

So I have a div that stick at the top right hand corner of my screen.

I can make the div stay at the top right hand corner using the following CSS:

.dockbar {
    background: #000000;
    width:300px;
    float:right;
    position: absolute;
    left:1180px;
    top:10px;
    height:38px;
}

But I hate this approach because the div has space to the right if the screen is larger. I would prefer to using percentage based sizing, but doing that causes the div to move with the screen (because of the percentage..)

Is there a way to position a div at the top right hand corner:

• Without using fixed positioning
• Without declaring exact pixel based positioning

Thanks

Answer 1

Change left:1180px; to right: 0px and everything should work fine.

#wrapper{
 width: 800px;
}

<div id="wrpper">
   <div class="dockbar"></div>
</div>

Something like this, maybe.