I am having a rather persistent problem trying to center text in a div that is a rounded corner rectangle.
I have tried using line-height, vertical-align, and the margin, and padding properties, to no avail. Has someone worked this before and might have a helpful hint?
Code:
Code: Select all
.navMenu {
width: 100%;
text-align: center;
height: auto;
}.nav_bl {
background: url(nav_bl.png) 0 100% no-repeat #FFFFFF;
width: 100%;
}
.nav_br {
background: url(nav_br.png) 100% 100% no-repeat
}
.nav_tl {
background: url(nav_tl.png) 0 0 no-repeat
}
.nav_tr {
background: url(nav_tr.png) 100% 0 no-repeat;
padding:3px
}Code: Select all
<div class="navMenu">
<div class="nav_bl"><div class="nav_br"><div class="nav_tl"><div class="nav_tr">
<a href="#">Home</a> <img src='nav_bullet.png' /> <a href="#">Products</a> <img src='nav_bullet.png' /> <a href="#">Blog</a> <img src='nav_bullet.png' /> <a href='#'>Contact Me</a> <img src='nav_bullet.png' /> <a href='#'>About Me</a>
</div></div></div></div>
</div>Any help would be GREATLY appreciated,
Thank you