cecilia Posted October 31, 2006 Share Posted October 31, 2006 Hi everyone,I'm have a problem centering vertically the text inside each list item, using CSS and avoiding any tables.This is the HTML: <div class="mainMenu"><ul><li ><a href="#">Item 1</a></li><li ><a href="#">Item 2</a></li><li ><a href="#">Item 3</a></li><li ><a href="#">Item 4</a></li><li ><a href="#">Item 5</a></li></ul></div> And this is the CSS: .mainMenu{ font: 8pt Helvetica; width: 150px; }.mainMenu ul { padding: 0; margin: 0; list-style:none;}.mainMenu ul li a { color:#000000; text-decoration:none; background: #FFFFFF; display: block; margin: 2px; padding: 0 0 0 3px; border: 1px solid #000000; height: 20px; text-align: center;}.mainMenu ul li a:hover { background: #cccccc; border: 1px solid #cccccc;} Any help?Muchas gracias! Link to comment Share on other sites More sharing options...
jesh Posted October 31, 2006 Share Posted October 31, 2006 Try using line-height: .mainMenu ul li a { color:#000000; text-decoration:none; background: #FFFFFF; display: block; margin: 2px; padding: 0 0 0 3px; border: 1px solid #000000; height: 20px; line-height: 20px; text-align: center;} Link to comment Share on other sites More sharing options...
cecilia Posted October 31, 2006 Author Share Posted October 31, 2006 Thanks so much Jesh!It worked perfect! Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now