Bruzzler: Breite vom Container bei Broswerverkleinerung - bitte Hilfe

Beitrag lesen

Hallo zusammen,

ich glaub ich steh grad auf dem Schlauch: ich hab eine Seite, bei der ist im Header ein bg-image eingebunden. Wenn das Browserfenster normal groß ist, sieht alles wunderbar aus, verkleiner ich das fenster, entsteht rechts ein rand und ich weiß nicht woher der kommt.

Hier mal mein Code:

  
<body>  
<div id="container">  
  <div id="header">  
        <h1>Ulrike Hub</h1>  
        <h2>Sonderpädagogin, Dipl. Pädagogin, Heilpraktikerin für Psychotherapie</h2>  
        </div>  
    		<div id="navigation" align="right">  
    			<ul>  
                 	<li><a>...</a></li>  
               </ul>  
            </div>  
    <div id="content">  
    </div>  
</div>  
</body>
  
* {  
	margin: 0;  
	padding: 0;  
}  
  
  
html {height: 100.01%;}  
body {  
	background-color: #f8f8f8;  
	padding: 0;  
	margin: 0;  
	font-family:Verdana, Geneva, sans-serif;  
	color:#869fb2;  
	font-size:13px;  
	line-height:1.4;  
	height: 101%;  
}  
  
#container {  
	margin: 0 auto;  
}  
  
#header {  
	height:170px;  
	background:url(../images/header_bg.gif) repeat-x top left;  
}  
  
#header h1 {  
	background:url(../images/logo_.png) no-repeat 50px 30px;  
	height: 170px;  
	text-indent: -9999px;  
	overflow: hidden;  
}  
  
#header h2 {  
	text-indent: -9999px;  
	overflow: hidden;  
}  
  
#navigation {  
	margin-top: -80px;  
	margin-left: 400px;  
        margin-right: 50px;  
	height:80px;  
	width:660px;  
	position:relative;  
}  
  
#navigation ul {  
	list-style-image:none;  
}  
  
#navigation ul li {  
	display:inline;  
	margin: 0 5px;  
}  
  
#navigation ul li a {  
	color:#FFF;  
	font-size:14px;  
	text-decoration:none;  
	background:url(../images/navi-button.gif) no-repeat top center;  
	padding-top:40px;  
}  
#navigation ul li#on a {  
	color:#6c8a8f;  
	font-size:14px;  
	text-decoration:none;  
	background:url(../images/navi-button_active2.gif) no-repeat top center;  
	padding-top:40px;  
}  
  
#navigation ul li a:hover {  
	color:#6c8a8f;  
	font-size:14px;  
	text-decoration:none;  
	background:url(../images/navi-button_active.gif) no-repeat top center;  
	padding-top:40px;  
}

Vielen Dank für Hilfe,

Bruzzler