Displaying an element above another

Hi Navid, thank you very much!!! In terms of position the 2 elements are exactly where I want them now :)

Unfortunately there seems to be a collapsing issue. I want the 3 elements in my header to display on the same line and not with such a big vertical gap between my logo on the left and the 2 elements on the right.

How do I overcome this?

http://i1285.photobucket.com/albums/a588/paul-masteel/pvs-nav2_zps2e673ed6.jpg (this is what it looks like now)

EDIT***

I have fixed it with a margin-top: -95px;

Is there any way to do it without using this?

which 3 elements you want in same line? you've to prevent using negative margins only when there is no other way.

It currently displays like this:

http://i1285.photobucket.com/albums/a588/paul-masteel/pvs-nav_zpsee8aa830.png (I have managed it display like this using a negative margin)

without the negative margin it looks like this: http://i1285.photobucket.com/albums/a588/paul-masteel/pvs-nav2_zps2e673ed6.jpg

I want the logo to be horizontally parallel with the nav and search bar. Thanks

http://codepen.io/anon/pen/vwAoL ;) without negative margin ;) goodluck!. offcourse you can use a div and store the logo in it. The most common thing i do for a logo i make a <h1> tag and store the logo as background and give it a negative text-indent like -100000px this makes it possible that Search Engines index your page better because it's symantic.

Thanks for the examples but I don't want them to appear on the same line I want the nav to appear directly beneath the search bar.

Thanks for trying but unfortunately that didn't work the elements still seemed to overflow and not position themselves how I wanted.

Just as a test I put a <br> tag in the html after <form> and before the <nav> and the vertical position is exactly how I want it but now the whole header section displays too tall. I want to achieve the same effect with CSS without using the <br> tag

I want it to look like this:

http://i1285.photobucket.com/albums/a588/paul-masteel/pvs-nav_zpsee8aa830.png

thank you!

hahah you're welcome dude, glad i could help!