Definierungspr.: Alles einnehmen außer l. u. r. 90px freilaßen.

[Patzel]

hi,

Ich habe erst vor kurzem zu Programmieren begonnen und habe jetzt eines meiner ersten CSS-Styles gemacht.

...or: #928AD0;}  
  
  #header                        {margin:0px 70px 0px 70px;background:#FFFFFF;font-size:13px;}  

Das ist einfach der Container, bei dem auf jeder Seite 70px Rand bleibt.

  
  #header div.paddingleft        {background:url(sw-left.jpg);background-repeat:repeat-y;width:10px;float:left;}  

Das ist ein Schwarzweiß-Übergang am linken Rand. Bei dem gibt es ein Problem: Wegen float:left; macht sich div.paddingleft natürlich so klein wie möglich. Aber ich hätte gern, dass es so lang wie die Grafik ist.

  
  #header div.header             {float:left;background:#FFFFFF;}  
  #header div.header div         {margin:0px 10px 0px 10px;right:300px;}  
  #header div.header div img     {width:100%;right:300px;}  

Das ist das Headerbild. Und hier liegt das Problem. 100% würde dann so aussehen, wie es in den Screens. ganz genau demonstriert wird. Mir ist schon klar, dass es mit 100% so aussehen muss. Nur will ich es so, dass es das ganze Fenster einnimmt und nur links u. r. 90px frei bleiben. (70px = margin außerhalb, 10px = Schwarzw.-Übergang, 10px = margin innerhalb)

  
  #header div.paddingright       {background:url(sw-right.jpg);background-repeat:repeat-y;width:10px;float:left;}  
  
  #menuma...  
...  
  #clear{clear:both;}...  

Der Vollständigkeit halben poste ich hier noch den HTML-Code:

  
...d>  
<div id="header">  

Der Container.

  
 <div class="paddingleft">&nbsp;</div>  

Einer der Problemdivs.

  
 <div class="header">  
  <div><img src="header.png"></div>  

Die Problemgrafik.

  
 </div>  
 <div class="paddingright">&nbsp;</div>  

Einer der Problemdivs.

  
</div>  
  
<div id="clear"></div>  
  
<div id="me...  

Hier noch eine Screendemo, wo noch Mal alles ganz genau steht.

[Beat]

#header div.header             {float:left;background:#FFFFFF;}
  #header div.header div         {margin:0px 10px 0px 10px;right:300px;}

Und wo ist die Angabe, die dir das relative Verschieben dieses Elements erlaubt?
position:relative, absolute oder fixed

#header div.header div img     {width:100%;right:300px;}

dito

mfg Beat

[Patzl]

#header div.header             {float:left;background:#FFFFFF;}
  #header div.header div         {margin:0px 10px 0px 10px;right:300px;}

Und wo ist die Angabe, die dir das relative Verschieben dieses Elements erlaubt?
position:relative, absolute oder fixed

#header div.header div img     {width:100%;right:300px;}

dito

mfg Beat

Danke für diesen Hinweis. Muss ich wohl übersehen haben. Ich habe ein bisschen herumprobiert und jetzt geht es in folgenden Browsern:

Name                         Version        Funktioniert?
Opera                        9.20           Ja
Mozilla Firefox              2.0.0.13       Ja
Microsoft Internet Explorer  6.0.2900.2180  Nein

Der Quelltext sieht in Moment so aus:

  
  #header                        {margin:0px 70px 0px 70px;background:#FFFFFF;font-size:13px;}  
  #header div.paddingleft        {background:url(sw-left.jpg);background-repeat:repeat-y;width:10px;float:left;}  
  #header div.header             {float:left;background:#FFFFFF;}  
  #header div.header div         {margin:0px 10px 0px 10px;left:0px;right:0px;position:relative;}  
  #header div.header div img     {width:100%;}  
  #header div.paddingright       {background:url(sw-right.jpg);background-repeat:repeat-y;width:10px;float:left;}

Hat jemand ne Idee wie man den MSIE6 dazu bringen könnte, diesen Q.-Text wie Opera u. Mozilla Firefox anzuzeigen.

lg

[Beat]

Beschäftige dich mit dem MSIE Box-Model Fehler und mache dich bereit für Conditional Comments.
Bei beidem kann ich nicht weiter helfen.
Mein MSIE6 ist gestorben und seine Auferstehung MSIE7 ist ziemlich bleich und hat Ausgangverbot.

mfg Beat