Einzelnen Beitrag anzeigen

Benutzerbild von RWarnecke
RWarnecke

Registriert seit: 31. Dez 2004
Ort: Stuttgart
4.408 Beiträge
 
Delphi XE8 Enterprise
 
#1

[CSS] Fusszeile an linke Spalte oder an den Hauptteil anpassen

  Alt 23. Jan 2011, 11:39
Hallo zusammen,

ich versuche mich gerade in CSS. Ich habe bis jetzt immer nur fertige Stylesheets angepasst (z.B. Farben, oder Abstände). Nun will ich mir ein eigenes Stylesheet aufbauen, womit ich künftig meine Webseiten mit gestalten will. Dieses soll 3 spaltig oder 2 spaltig sein, entsprechend der Anforderung. Ich versuche mich gerade an einem zweispaltigen Layout mit Kopf- und Fußzeile. Das ganze sieht auch schon recht annehmbar aus. Ich habe aber zwei Probleme :
  1. Beim IE8 unter Windows 7 wird die linke Spalte etwas versetzt nach unten angezeigt. Was habe ich falsch gemacht, da in allen anderen Browsern es richtig angezeigt wird ?
  2. Ich würde gerne die Fusszeile über beide Spalten haben und diese soll ich immer der längsten Spalte anpassen. Wie kann ich das realisieren ?

Hier dazu mein Quelltext :
Code:
body {
   font-family: serif;
   font-size: 15px;
   background-color: #fff;
   color: #000;
   padding: 10px 0 0;
   margin: 0;
   }
HTML>body {
   padding: 0;
   max-width: 1400px;
   }

#header {
   background-color: #d5fcf4;
   padding: 0;
   border: 1px solid #0c9;
   margin: 10px;
   height: 100px;
   }

#main {
   background-color: #d5eeff;
   padding: 0;
   border: 1px solid #09f;
   margin: 10px 10px 10px 247px;
   }

#footer {
   background-color: #eed5ff;
   padding: 0;
   border: 1px solid #90f;
   margin: 10px 10px 10px 10px;
   }

#left {
   background: #ffd5ee;
   padding: 0;
   border: 1px solid #f09;
   margin: 10px;
   width: 225px;
   position: absolute;
   top: 112px;
   left: 0;
   }
Noch meine Index.html:
Code:
<link rel="stylesheet" href="layout.css" type="text/css" />
<body>

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

<div id="left">
   ...<br>
   ...<br>
   ...
</div>

<div id="main">
   ...<br>
   ...
</div>

<div id="footer">
   ...
</div>

</body>
Rolf Warnecke
App4Mission
  Mit Zitat antworten Zitat