[CSS] CSS Style entspricht nicht ganz dem Wunsch

ibot · 15. Mai 2009

CSS Style entspricht nicht ganz dem Wunsch

Hi,
ich breuchte nochmal deine Hilfe. Wäre echt super.

Ich habe mir mein css Style mal so einigermaßen gebastelt bzw. erstellen lassen aber nunja es ist nicht ganz so wie erwartet:
Ich möchte das der Footer fest unten an der Browserleiste ist und sich der Inhalt in der Mitte (content) natürlich so auch flexibel verhält.

Also je nach Auflösung soll der content div größer oder kleiner werden.

Außerdem soll wenn möglich der div content und der div left jeweils immer einen gewissen Abstand vom rechten bzw. linken Rand haben, also meinetwegen 50px (kann auch 20 oder 30 sein).

Könntet ihr mir da helfen?
So solls ungefähr ausschauen:

http://www.bilder-space.de/show.php?...NSog5PRpRm.jpg

Hier das .css bisher:

PHP:

  html ,  body {
     background :  #E7E7E2;
     margin : 0 ;
     padding : 0 ;
     text - align : center ;
     font - family :  Andalus ;
     font - size :  18px ;
     color :  #ffffff;
  }
 
  #gesamtseite{
     width : 1000px ;
     text - align : center ;
     margin - left : auto ;
     margin - right : auto ;
}
  #header{
     position : relative ;
     height : 100px ;
     background - color : #848282;
     width : 100 %;
     text - align :  center ;
     z - index :  100 ;
     border :  1px solid  #c5c5c5;
  }
  #left{
     width : 149px ;
     float : left ;
     position : relative ;
     background - color : #848282;
     border - left :  1px solid  #c5c5c5;
     border - bottom :  1px solid  #c5c5c5;
     border - top :  1px solid  #c5c5c5;
  }
  #twocols{
     width : 850px ;
     float : right ;
     position : relative ;
}
  #content{
     background - color :  #848282;
     text - align : center ;
     float :  left ;
     display : inline ;
     position :  relative ;
     width : 100 %;
     height : 470px ;
     overflow : auto ;
     border :  1px solid  #c5c5c5;
  }
  #footer{
     position :  relative ;
     left :  150px ;
     height : 40px ;
     width :  850px ;
     background - color : #c5c5c5;
     color :  #363636;
     font - size :  16px ;
     border :  1px solid  #c5c5c5;
     clear : both ;
     text - align : center ;
}

Die html Seite dazu:

HTML:

<html>
 <head>
 <link rel="stylesheet" href="gut.css" type="text/css"/>
 </head>
 <body>
 <div id="gesamtseite">
 <div id="header">
 hallo head
 </div>

 <div id="twocols">
 <div id="content">
 hallo content
 </div>
 </div>

 <div id="left">
 hallo left
 hallo
 </div>

 <div id="footer">
 hallo footer
 </div>
 </div>
 </body>
</html>

Anzeige

sgt_bilko · 15. Mai 2009

AW: CSS Style entspricht nicht ganz dem Wunsch

footer ganz unten im browser sollte so gehen

Code:

#footer{
 position: absolute;
 left: 150px;
 bottom: 0px;
 height:40px;
 width: 850px;
 background-color:#c5c5c5;
 color: #363636;
 font-size: 16px;
 border: 1px solid #c5c5c5;
 clear:both;
 text-align:center;
}

ibot · 15. Mai 2009

AW: CSS Style entspricht nicht ganz dem Wunsch

Naja das hatte ich auch schon aber dann sieht das ganze so aus:

http://s11.directupload.net/file/d/1795/675z9z89_jpg.htm

Also der Fotter ist zentral unten aber er ist nun nicht mehr direkt unter dem content.
Und das schlimmste: Wenn man einfach mal die Größe des Browsers ändert dann schiebt sich das div content direkt hinter den footer was ja nicht sein soll.

phraser · 18. Mai 2009

AW: CSS Style entspricht nicht ganz dem Wunsch

was wir mal festegestllt haben

Code:

 float : right;

funktioniert zumindest im zusammenhang mit

Code:

 float : left;

weder im IE noch im Firefox.
Würde dir raten das ganze ein wenig anders zu schachteln:

Code:

div haupt
 div links
 div content
 div footer

Dann kannst du dein Menü mit float links schweben lassen und den content per auto auf die größe festlegen!
Theopraktisch sollte dann auch der footer drunter sein

Nützliche Suchen

[CSS] CSS Style entspricht nicht ganz dem Wunsch

Videos zum Themenbereich