How to place div in top right hand corner of page

Question

How do you float a div to the top right hand corner of a page using css? I want to float the topcorner div which is below:

<p><a href="login.php">Log in</a></p>

<div class="topcorner"><a href="home.php">Back to Home</a></div>

log in goes in left hand corner which it does at moment, I want home link to be placed in other corner,

Answer 1

the style is:

<style type="text/css">
 .topcorner{
   position:absolute;
   top:0;
   right:0;
  }
</style>

hope it will work. Thanks

Answer 2

You can use css float

<div style='float: left;'><a href="login.php">Log in</a></div>

<div style='float: right;'><a href="home.php">Back to Home</a></div>

Have a look at this CSS Positioning

Answer 3

<style type="text/css">
 .topcorner{
  position:absolute;
  top:10;
  right:15;
  }
</style>

You ca also use this in CSS external file.

Answer 4

Try css:

.topcorner{
    position:absolute;
    top:10px;
    right: 10px;
 }

you can play with the top and right properties.

If you want to float the div even when you scroll down, just change position:absolute; to position:fixed;.

Hope it helps.