Menu
At the top of my page I want to have the title of the page aligned to the left of the screen with a short nav menu aligned to the right of the screen. I can achieve this using float but the two elements have different baslines i.e. the baseline of the text appears different. Is there any way to get this to work using css? I have a sample of what I'm trying to do up on jsfiddle http://jsfiddle.net/nBPCG/63/
644
One thing to remember, if you have different sizes of text that you need to align, is to align it to x-height or baseline. If there is a caps font then align them to baseline or cap-height. And remember NEVER to align horizontally different font sizes fonts on the central line.
To center both vertically and horizontally, use padding and text-align: center : I am vertically and horizontally centered.
Hi you can use display:inline-block in your h1
or see the Fiddle:- http://jsfiddle.net/nBPCG/101/
66
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
