Problem CSS Layout

  • olliu olliu
    TYPO3-Anwärter
    0 x
    5 Beiträge
    0 Hilfreiche Beiträge
    17. 10. 2008, 11:59

    hallo ich bastel gerade die grundstruktur für eine neue seite und habe dabei ein paar probleme.

    zunächst was ich bisher habe

    html
    [HTML]<html>
    <head>

    <link href="./css/style.css" rel="stylesheet" type="text/css">

    </head>
    <body>

    <div id="container"><div id="header">Header

    </div><div id="navi">
    Navi
    </div><div id="rechts">Rechts
    </div><div id="inhalt">
    Inhalt
    </div><div id="footer">Footer

    </div>

    <div style="clear: both;"></div>
    </div>
    </body>
    </html>[/HTML]

    CSS
    [HTML]html,body{margin:0;padding:0;background-image: url(../img/metallkachel.jpg);height:100%;}
    body{font: 76% arial,sans-serif;text-align:center;}
    p{margin:0 10px 10px}
    a{display:block;color: #981793;padding:10px}
    div#header h1{height:80px;line-height:80px;margin:0;
    padding-left:10px;background: #EEE;color: #79B30B}
    div#container{text-align:left;background-image:url(../img/fauxcolumns.jpg);min-height: 100%;}
    div#inhalt{background:#CCCCCC}
    div#inhalt p{line-height:1.4}
    div#navi{background:#FFCC33}
    div#rechts{background:#B9CAFF}
    div#footer{background: #333;color: #FFF}
    div#footer p{margin:0;padding:5px 10px}

    div#container{width:900px;margin:0 auto}
    div#header{float:left;width:653px;margin:0 auto;background-image:url(../img/h1.jpg);height:148px;}
    div#inhalt{float:left;width:653px}
    div#rechts{position:absolute;float:right;width:247px;top:0px}
    div#navi{float:left;width:653px}
    div#footer{clear:both;width:100%}[/HTML]

    rechts wird in der vorschau im firefox (sicherlichauch anderen browsern) nicht auf der rechten seite angezeigt wobei mir dreamweaver das richtig darstellt. div#rechts soll also als rechte sidebar dienen neben header navi footer.

    dann bräuchte ich links neben header,navi,footer auch noch eine "sidebar" quasi einen abstand, irgendwie will das aber nicht gehen

    ein letztes problem besteht darin dass ich die seite immer 100% dargestellt haben möchte, also der footer immer am seitenende unten ist, das hab ich mit min-height probiert beim div#container aber scheint nicht zu gehen.

    danke im vorraus


  • 1
  • 0 x
    89 Beiträge
    0 Hilfreiche Beiträge
    17. 10. 2008, 12:29

    hallo,

    zum CSS-Debuggen kann ich immer nur wieder die FF-Extension Firebug empfehlen, damit lösen sich die meisten Probleme von selbst.

    und den Footer nach unten ist kein triviales Problem, aber ein gelöstes: [url]http://www.themaninblue.com/writing/perspective/2005/08/29/[/url]

    viel Spaß, Nils

  • 1