div'ы крест накрест

[forest69]

Добрый вечер всем.

Нужно было сверстать вот так:

Так, чтобы 1 див был на все окно браузера.

У меня получилось сделать для хрома с разрешением 1440х990

В других браузерах и при других разрешениях получается все криво.

Может кто-нибудь помочь сверстать кроссбраузерно?

Даже хотябы не на весь экран, главное чтобы было крест накрест.

Вот мой код странички:

<!-- LEFT -->
<div class="hor" id="left">
	<div class="section">
		<h1>LEFT</h1>
		<a href="#" class="next">Next</a>
	</div>
</div>

<!-- TOP -->
<div class="vert" id="top">
	<div class="section">
		<h1>TOP</h1>

		<a href="#" class="down">Down</a>
	</div>
</div>

<!-- MIDDLE -->
<div class="hor" id="mid">
	<div class="section">
		<h1>MID</h1>
		<a href="#" class="back">Back</a>
		<a href="#" class="next">Next</a>
		<a href="#" class="up">Up</a>
		<a href="#" class="down">Down</a>
	</div>
</div>

<!-- BOTTOM -->
<div class="vert" id="bot">
	<div class="section">
		<h1>BOT</h1>
		<a href="#" class="up">Up</a>
	</div>
</div>

<!-- RIGHT -->
<div class="hor" id="right">
	<div class="section">
		<h1>RIGHT</h1>
		<a href="#" class="back">Back</a>
	</div>
</div>

А вот CSS:

html{	 
	background-color:#424242;
}

body{
	left:0;
	position:fixed;
	top:0;
	bottom:0;
	width:300%;
	height:300%
}


.hor{
	/* Each step takes a third of the width */

	float:left;
	height:33.333%;
	width:33.3333%;
	overflow:hidden;
	position:relative;
}

.vert{
	/* Each step takes a third of the width */

	float:none;
	height:33.333%;
	width:33.3333%;
	overflow:hidden;
	position:relative;
}

/* left */

#left{ 
	  background: no-repeat center center #6f7c18;
	  margin-left:-33.333%
}

/* top */

#top{ 
	  background: no-repeat center center #09C;
	  margin-top:-18.12%;
}

/* mid */

#mid{ background: no-repeat center center #175765;}

/* bot */

#bot{ 
	  background: no-repeat center center #3C9;
	  margin-top:18.12%
}

/* right */

#right{background: no-repeat center center #6a4214;}



/* Each step contains a section, centered in the page */

.section{
	height:550px;
	left:50%;
	margin:-275px 0 0 -328px;
	position:absolute;
	top:50%;
	width:655px;
}

[psywalker]

Лень разбираться в коде. Покажи скриншот на выходе.

[forest69]

Вот так отображается в хроме:

Центральный див:

Левый див:

Верхний див:

А так в опере:

Центральный див:

Левый див:

Верхний див: