Just a quick warning, if you are the person responsible for this kind of code, I will tell your mom. I really will.

<span 
	class="button-active" 
	id="xf-384">
	<div 
		id="x176901972nav-button" 
		class="xbl-component xbl-fr-button">
		<span 
			id="x176901972nav-button$xf-1369" 
			class="yui-button yui-push-button xforms-group">
			<span 
				class="first-child">
				<button 
					id="x176901972nav-button$xf-1370" 
					class="xforms-control xforms-trigger" 
					type="button" 
					tabindex="0">
					Uw gegevens
				</button>
			</span>
		</span>
	</div>
</span>

This is wrong on so many levels, I can't even begin to describe it. The CSS written to style this is even worse. The sad thing is that this could be done, with just the frigging button and nothing else.

I can't even think of a reason why someone would want to do this, other than complete contempt for the world. This is obviously being written by someone who thinks front end code is very hard to do, like a java developer.

Quick piece of advice, hire a decent front end developer and don't do it your self…

The sad thing is that I saw this on a governmental site, so tax payers will pay for this incompetence.

The proper code for this should of course be this:

<button 
	id="x176901972nav-button$xf-1370">
	Uw gegevens
</button>

Although I think the id could be more logical, but I'll give the back end guys that…