div soll restlichen Platz nutzen

[Felix]

Hallo,

der Titel klingt nicht besonders aufregend, aber mir ist kein besserer eingefallen. Hier das Problem, an dem ich mir die Zähne aus beiße:

Ich habe eine normales Layout mit Header und Content Bereichen. Diese haben insgesamt die Höhe von 692px. Einzubauen ist ein dritter Bereich, der ein teilweise transparentes Bild enthält in in den Content-Bereich hineinragen soll. Es soll bei x: 400px und etwas rechts der horizontalen Mitte anfangen. Das habe ich alles noch hin bekommen. Jetzt das Problem: Dieses Bild muss nicht ganz zu sehen sein, es soll lediglich den Platz nutzen, der von der angegebenen Start-Position noch nach rechts und unten frei ist, so dass keine Scrollbars im Browser angezeigt werden.

Hier mal meine css-Datei (#king ist das Problemkind ):

Code: Alles auswählen

@CHARSET "ISO-8859-1";

html{
   height: 100%;
   margin: 0px;
}

body{
   height: 100%;
   widht: 100%;
   margin: 0px;
   
   background-image: url(../img/background.png);
   background-repeat: repeat;
}

#header{
   width: 812px;
   height: 158px;
   
   position: relative;
   left: 50%;
   margin-left: -406px;
   
   background-image: url(../img/banner.png);
   background-repeat: no-repeat;
   background-position: center top;
}

#content{
   width: 738px;
   height: 534px;
   
   position: relative;
   
   left: 50%;
   margin-left: -369px;
   
   background-image: url(../img/paper.png);
   background-repeat: no-repeat;
   background-position: center top;
}

#king{
   width: 100%;
   height: 100%;
   
   position: relative;
   top: -290px;
   left: 50%;
   margin-left: 60px;
   
   background-image: url(../img/king.png);
   background-repeat: no-repeat;
   background-position: left top;
}

[Azra]

Wenn du das Bild absolut positionierst erzeugt es keinen Scrollbalken da es aus dem Fluß der Seite geholt wird. Da das Bild sowieso größer als das Browserfenster zu sein scheint ragt es darüber hinaus und wird automatisch rechts & unten abgeschnitten.

Aber was ist mit Leuten die große Monitore haben?