HTML header and link on the same line
I am new to css. I want to display an h2 heading in the center and a link at the right end on the same line.
I tried several options, but they all align the title to the left. Any help is appreciated.
Thank.
+3
shruthi
source
to share
2 answers
There are several ways to do this. The easiest and fastest way I can think of is to use a parent div and put a title and link in 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;
}
+9
sarcastyx
source
to share
Write like this:
Html
<h1>heading <a href="#">link</a></h1>
CSS
h1{
text-align:center;
}
h1 a{
float:right;
}
Check http://jsfiddle.net/KJSmB/
+1
sandeep
source
to share