Elemente zentrieren aber Bewegungsfähig halten

Cyborg

Grünschnabel
Hallo Leute,

folgendes Szenario:

Ich habe 3 Elemente in einem zentrierten div (hintereinander gefloatet).
Die beiden rechten Elemente (schwarz, blau) sollen beim verkleinern des Browsers über das link Element (gelb) wandern.

Wie bekomme ich das gebacken ?

Hier noch der Code:
Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
<html>
<head>
<style type="text/css">
<!--
.Header{
 		height: 535px;
 		width: 1090px;
 		margin-left: auto;
 		margin-right: auto;
 }
 .logo {
	float: left; width: 800px; height: 187px;
	background: yellow;
 }
		
 .button1{
	float: left; width: 170px; height: 170px; background: black; 
 }
		
 .button2{
	float: left; width: 93px; height: 93px; background: blue;
 }
-->
</style>
</head>
<body>

<div class="Header">
		
		<div class="logo"></div>
		
		<div class="button1"></div>
		
		<div class="button2"></div>
		
</div>

</body>
</html>

Und eine Beispielseite
 
Problem gelöst:

- Headerklasse: max-width: 100%
- gelber container: position: absolute
- blauer, schwarzer Container: float: right, position: relative
 
Zurück