[SOLVED] Simple list navigation

[Letterbomb05]

Hi,

 

I'm having some trouble creating this list navigation that I want. I was just creating the main frame for the menu with ugly background colours etc. I'd rather not use tables, not sure if this will work though.

 

	<ul>
		<li class="MainHeader">Main</li>
		<li>
			<ul>
				<li class="link"><a href="">Link 1</a></li>
				<li class="link"><a href="">Link 2</a></li>
			</ul>
		</li>
	</ul>

	<br />

	<ul>
		<li class="MainHeader">Main Header</li>
		<li>
			<ul>
				<li class="link"><a href="">Link 1</a></li>
				<li class="link"><a href="">Link 2</a></li>
				<li class="link"><a href="">Link 3</a></li>
				<li class="link"><a href="">Link 4</a></li>
			</ul>
		</li>
	</ul>

	<ul>
		<li class="MainHeader">Main Header</li>
		<li>
			<ul>
				<li class="link"><a href="">Link 1</a></li>
				<li class="link"><a href="">Link 2</a></li>
				<li class="link"><a href="">Link 3</a></li>
				<li class="link"><a href="">Link 4</a></li>
			</ul>
		</li>
	</ul>

 

The problem is clear when seen in the Demo (Full CSS is found there). I'm working in XHTML Strict. I need to get the lists appearing below each other so I have the Header, the links below, then the 2nd header with the other links below that, no gaps. Feel free to ask questions if I havn't been clear enough, thanks in advance for any help!

 

~Letterbomb05.

[Letterbomb05]

Fixed with tables.