greenboxgoolu
greenboxgoolu

Reputation: 139

HTML a href alignment

Currently, this is my code:

@media (max-width: 500px) {
  a {
    text-align: left;
    font-size: 90%;
    float: left;
  }
}

How do I align my hyperlink to the right side?

Currently, if I am using float:left, it will be stacked with my other element.

Example

enter image description here

Fixed with the code > "clear: both" .

Upvotes: 0

Views: 292

Answers (3)

elahe karami
elahe karami

Reputation: 693

wish you had explained your problem better along with your HTML code. Anyway, you can use display flex that is much better than float. Or you can use text-align: right. if you want them on one row, delete flex-direction.

.container{
  display: flex;
  align-items: flex-end;
  flex-direction: column;
}
<div class="container">
  <a href="#">click</a>

  <a href="#">click</a>

  <a href="#">click</a>
</div>

Upvotes: 1

Harshsetia
Harshsetia

Reputation: 265

Use below code for align right the link:

@media (max-width: 500px) {
  a {
    text-align: left;
    font-size: 90%;
    float: right;
    display: block;
    overflow: hidden;
  }
}

Upvotes: 0

Arsham
Arsham

Reputation: 153

In in order to make the anchor tag go the right you would need to use float right instead of float left. You can also align the text to the left

.linkright a {
  text-align: left;
  font-size: 2rem;
  float: right;
}
<div class="linkright">
  <a href="#"> click me! </a>
</div>

Upvotes: 0

Related Questions