CODEWITHSUNDEEP
htmlhyperlinkalignment
Ashfaqur Rahaman
Ashfaqur Rahaman

Reputation: 758

How to align series of HTML links horizontaly?

I have three links. I want to align them like one in the left, one in the middle and one in the right in a single line. Say my links are prev(which I want place in the left of the line) home(which I want place in the middle of the line) and next(which I want place in the right of the line). So I wrote this code:

<a href="link">prev</a>
lots of &nbsp;
<a href="link">home</a>
lots of &nbsp;
<a href="link">next</a>`

I understood this is wrong because its a fixed size and will cause problem if I resize my window or in a relatively small screen. So I tried this:

<a href="link" align="left">prev</a>
<a href="link" align="center">home</a>
<a href="link" align="right">next</a>

But it didn't work! So how can I solve this problem with HTML?

`

Upvotes: 2

Views: 156

Answers (1)

dfsq
dfsq

Reputation: 193261

Wrap links with a div container and use left/right floats and text-align: center on the wrapper:

.wrap {
    text-align: center;
    background: #EEE;
    padding: 10px;
}
.wrap .left {
    float: left;
}
.wrap .right {
    float: right;
}
<div class="wrap">
    <a href="link" class="left">prev</a>
    <a href="link">home</a>
    <a href="link" class="right">next</a>
</div>

Upvotes: 1

Related Questions