CSS newbie: How to align my link to the right side of the page?


Tags: html,css

Problem :

I have a link on my index page:

<div class="content">
    <a class="buy" href="buy.html">Buy</a> 
</div>

I would like to align it to the right side of my page, I tried:

a.buy{
  color: #2da1c1;
  font-size: small;
  text-decoration: none;
  left: 252px;
  float: left;

}
a.buy:hover
{
color: #f90;
text-decoration: underline;
left: 252px;
float: left;                 
}

But it still located on the left side. (I have included my CSS file in my index.html, and the CSS file already take effect for other elements on the page)



Solution :

Try float: right:

a.buy {
    color: #2da1c1;
    font-size: small;
    text-decoration: none;
    float: right;
}
a.buy:hover
{
    color: #f90;
    text-decoration: underline;         
}

Another way would be:

.content {
    position: relative
}
a.buy {
    color: #2da1c1;
    font-size: small;
    text-decoration: none;
    position: absolute;
    right: 0;
}
a.buy:hover
{
    color: #f90;
    text-decoration: underline;         
}

    CSS Howto..

    How to slide in divs from off screen into absolute layout using CSS transitions?

    How to wrap a div containing text around a div containing an image?

    How do I style the asp.net membership control with css?

    how to make nav auto adjsust its menu items using css?

    How do I make an image semi-transparent?

    CSS transition: how to produce this effect (linking transitions)

    How to FadeIn a parent element and then it's child elements with a slight Delay (CSS Only)

    How does one implement dark/transparent text-boxes?

    How to make a sliding dashboard similar to medium.com? [closed]

    How to create CSS heart? / Why is this CSS creating a heart shape?

    How to make a floated div 100% height of its parent?

    How to add a custom CSS file in ExtJs 5?

    How to have 2+ boxes slide down

    jQuery hide() and show() not working as expected

    How to hide element with css with specific title?

    How do you find the largest font size that won't break a given text?

    How to find the css class of an anchor link inside a cross domain iFrame?

    How to make the element located in the center of a div?

    How to work with CSS efficiently?

    How can I keep the elements inside a div independent from it's CSS3 animations?

    How quora put that image on their home page? [closed]

    How do I make a hamburger menu display on the right side?

    Node/Grunt - Autoprefixer - How to add configuration to my Gruntfile.js & how to check supported browsers?

    How to change the css and html file at the same time

    How to id dom table so I can position it on page?

    How to make a slider with divs and variable width?

    CSS: How to refer to a tag

    how to make the navbar fixed to top

    How do you make the colour of a h1 tag to change if the user hovers over the body in css and html?

    CSS: how to get scrollbars responsive for div inside container when user resizes it upwards