[SOLVED] Help on menu bar width and height and text align
 

Hello,

I manage to change the width and height of the menu bar and text align all ok. I am trying to change the text valign to middle but it didn't work. Here is what I inserted into the CSS

ul.rMenu li a {width:120px; height:44px; text-align:center; text-valign:middle; } /* custom menu centered */

Everything went ok but the text is centered but up the top


Hope someone can help


Thanks

I don't think text-valign is valid. I would Google vertical align CSS.

Where did you come up with 'text-valign'?

Thanks for the reply.

I was just trying to work things out and also I got the valign in the code in dreamweaver.

Is there any other way that I can have the text to sit in the middle instead of being up the top?

Thanks

You will have to play a bit, you could try with padding or margins. If you do a google search 'CSS text vertical align' you'll find sone hacks.

Thanks for that,

After searching I have tried a lot of way to vertical align the text to the middle with out success.:confused:

This is what I have tried

ul.rMenu li a {width:110.5px; height:44px; text-align: center; vertical-align: middle;} /* custom menu centered */

ul.rMenu li a {width:110.5px; height:44px; text-align: center; margin-top:-25px;} /* custom menu centered */

ul.rMenu li a {width:110.5px; height:44px; text-align: center; position: relative; #top: -50%} /* custom menu centered */

ul.rMenu li a {width:110.5px; height:44px; text-align: center; padding: 50px;} /* custom menu centered */

I am not even sure if I am going about this the right way. Here is the my site http://eslwiz.thekindle4.me/en/ and as you can see I just want the text to sit in the middle, at the moment it is sitting up the top.

Sorry guys I just can't work it out

Thanks

Instead of using a height use padding to create the necessary height. Maybe something like the following in place of what you have.

Thanks mate,

You're good.

I also add the width so I could even it up. here is what I did and it is ok.

ul.rMenu li a {width:84.5px;
text-align: center;
padding: 15px 18px !important; font-weight: bold;
}

Thanks