position links at the middle of div bar
I like to do the following using css:
Have a div bar 100pt from top of the page. The div bar will be about 100pt thick. Then at the "middle" of the div bar I like to have the menu options. I got the following so far, however the menu items (links) are not 开发者_StackOverflowcentred:
.top_header {
background-color:#3B5998;
height:70px;
margin-left:0px;
margin-right:0px;
top:60px;
position:relative
}
.top_header a, .top_header a:visited, .top_header a:hover, .top_header a:active, .top_header a:focus {
color:white;
font-size:x-large;
font-family:Arial
}
One way to do this is to add line-height
, setting it as the same height
as the div
.
line-height:70px;
http://jsfiddle.net/jasongennaro/EXqkT/
This aligns it vertically.
Then, if you want to center it horizontally, you can add
text-align:center;
http://jsfiddle.net/jasongennaro/EXqkT/1/
Add
`text-align:center;'
to .top_header.
add style text-align:center; to top_header div http://jsfiddle.net/rajani5022/CpsX2/4/
add margin:auto
to .top_header a
精彩评论