strukturerat?

Håller på att göra om https://www.sarina.se till xhtml och har stött på lite problem. Man ska ju ha allting så strukturerat och bra, men det går ju inte:

	<div id="divVansterMeny">
		<img src="/images/layout/menu_top.gif" alt="" />
		<br />
		<img src="/images/layout/menu_header.gif" alt="" />
		<p class="pVansterMeny">
			» Hem
			<br />
			» Dagens Rätter
			<br />
			» Menyn
			<br />
			» Rabattkort
		</p>
		<img src="/images/layout/menu_header.gif" alt="" />
		<p class="pVansterMeny">
			» Kontakt
			<br />
			» Om Företaget
		</p>
		<img src="/layout/menu_bottom.gif" alt="" />
	</div>

det blir ett stort mellanrum mellan dessa två bilderna

		<img src="/images/layout/menu_top.gif" alt="" />
		<br />
		<img src="/images/layout/menu_header.gif" alt="" />

... när man kör fint och strukturerat (med tabbar). För att undkomma detta behöver man visst skriva:

		<img src="/images/layout/menu_top.gif" alt="" /><br /><img src="/images/layout/menu_header.gif" alt="" />

... men då försvinner ju hela strukturen om man ska hålla på och göra så, det gäller <img><p> också.

Nån som vet hur man ska skriva detta för att få det och se bra ut både på sidan och i koden?

Använd en editor som både kan strukturera snyggt och ta bort alla onödiga mellanrum.
Spara alltid "osnyggt" - dvs utan extra mellanrum och börja vare redigering med att formatera koden automatiskt igen

Arachnophilia är *ett* exempel på en sådan, och de formateringar du inte är nöjd med kan du ändra genom att konfigurera om den...