Html heading and link in the same line

css, html

Solution

There are a few ways you can do this. The simplest and quickest way that I can think of is using a parent div and putting the heading and link inside it. So your HTML will look like this:

<div class="test">
    <h2>Heading comes here</h2><a href="">Link comes here</a>
</div>

Your styles can be as follows:

.test {
    text-align: center;
}
h2 {
    display: inline-block;
}

a {
    float: right;
}

Problem

I am new to css. I want to display a heading h2 in the center and a link in the right end in the same line. I tried a few options, but all of them align the heading to the left. Any help is appreciated. Thanks.

Original source