Inline Form

[wrichards8]

Can someone help me out? I have a horizontal navigation bar using the HTML5 <header> and <nav> tags. The navigation links only take up 25% of the bar that's created and I want to put a search form at the end. I have this code so far

header nav					{
											border: #FFFFFF thin solid;
										}
header nav ul				{							
											list-style: none;
											padding: 0;
											margin: 0;
											background: #000000;
										}
header nav li				{	
											padding-top: 3px;
											padding-bottom: 3px;
											padding-right: 3px;
											display: inline-block;
											color: #FFFFFF;
										}
header nav li a				{
											padding-left: 2px;
											padding-right: 2px;
											border: #FFFFFF medium solid;
											color: #FFFF00;
										}
header nav li a:active	{
											color: #FFFF00;
										}
header nav li a:hover	{
											color: #00FF00;
										}
form#search					{
											display: inline;
										}
form#search label 		{
											color: #FFFFFF;
										}

The problem is that my form appears underneath the nav bar, even though it is declared within the <nav> tag in my index.php, when in fact I want it at the end of it (to make best use of screen real estate)

[wrichards8]

I have worked it out now

[Helx]

I have worked it out now

I would've helped you, but I just didn't know how to do it
Could you please share how you got it working?

[wrichards8]

Yes, after playing around for a couple of days I thought "hang on, isn't <ul> a block level element" so I defined

nav ul { display: inline-block;}