Display search bar and links side by side (list or float?)

Hi guys,

being fairly new to this, Im starting to pull my hair out trying to get this to work. Im more of a 'graphic' designer than web, but anyway, on to the problem.

I have this menu with a search bar and links that i want to display underneath it:

http://www.users.on.net/~plaedien/links.png

Here is what i have at the moment:

http://www.users.on.net/~plaedien/pd_test/index-TEST.htm#


the navigation works great, the logo lines up, but i cannot figure out how to get the search bar, search button and three icon links to line up horizontally.

I thought I could float them all as separate DIVs, but i couldnt seem to get that to work. I noticed other sites that had used a <li> to do this as well, but again im not sure i can nest a <div> inside a <li> element - especially the search bar.

Any suggestions would be appreciated!

Hello plaedien,
Floats are how you usually get different elements beside each other. Have a try with this - .search ul li {float: left;}

and there it is!

I cant believe i didnt pick up on that tiny little detail- thank you :D