Hi!
I'm building a website with 2 navigation menus in header, the problem is that I can't add margin to the menu in top right corner. I need it to be moved about 5-8 px above current position. I'll be glad if anyone can point where I made a mistake.
I post my code on the JS Fiddle ( http://jsfiddle.net/PrUwD/ ) but it doesn't look how it should be, so please take a look at screenshot: http://cl.ly/image/3M2z0R2p320m
How to make links "This is top navigation menu" a few px higher?
Thanks!
If I understand your problem correctly, you only have to add this to the .topnav element :
margin: 10px 0;
Or you code also add this to .topnav li a instead :
display: block; padding: 10px 0;
It's up to you. The second option makes links a bit larger, easier to click.
When you say higher do you mean taller?
Paulie_D I mean it should be 5px above position on the screenshot.
HugoGiraudel your first code didn't make any effect and second one (.topnav li a) moved menu (and form) down instead of up.
II just tried it, so I guaranty you my code work. Anyway, you just have to play around paddings and margins.
HugoGiraudel, ok to be sure you understand me correct (I know my english is very bad, sorry about that)
How things looks like now: http://cl.ly/image/2G3R21232A34 How I want it to be: http://cl.ly/image/0F2e2K111z0g After your code: http://cl.ly/image/0B253w1j2Q2Q
try
position: absolute; top: 0;
ronangelo - no luck
Try adding
.topnav { text-align:right; }
There you go : http://jsfiddle.net/PrUwD/1/.
Hi!
I'm building a website with 2 navigation menus in header, the problem is that I can't add margin to the menu in top right corner. I need it to be moved about 5-8 px above current position. I'll be glad if anyone can point where I made a mistake.
I post my code on the JS Fiddle ( http://jsfiddle.net/PrUwD/ ) but it doesn't look how it should be, so please take a look at screenshot: http://cl.ly/image/3M2z0R2p320m
How to make links "This is top navigation menu" a few px higher?
Thanks!
If I understand your problem correctly, you only have to add this to the .topnav element :
Or you code also add this to .topnav li a instead :
It's up to you. The second option makes links a bit larger, easier to click.
When you say higher do you mean taller?
Paulie_D I mean it should be 5px above position on the screenshot.
HugoGiraudel your first code didn't make any effect and second one (.topnav li a) moved menu (and form) down instead of up.
II just tried it, so I guaranty you my code work. Anyway, you just have to play around paddings and margins.
HugoGiraudel, ok to be sure you understand me correct (I know my english is very bad, sorry about that)
How things looks like now: http://cl.ly/image/2G3R21232A34 How I want it to be: http://cl.ly/image/0F2e2K111z0g After your code: http://cl.ly/image/0B253w1j2Q2Q
try
ronangelo - no luck
Try adding
There you go : http://jsfiddle.net/PrUwD/1/.