Ergebnis 1 bis 2 von 2

Thema: Header/Footer Problem

  1. #1
    HTML Newbie
    Registriert seit
    28.08.2013
    Beiträge
    2
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard Header/Footer Problem

    Hallo zusammen,

    ich habe ein kleines Problem bei dem Layout meiner Website.
    Ich möchte einen Header, einen Footer sowie einen Inhaltsteil haben. Der Header soll über die komplette Seitenbreite gehen. Der Inhalt und der Footer sollen jedoch beide eine fixe Breite haben. Nun habe ich versucht dieses Problem mit einem Wrapper zu lösen. Dieser steht außerhalb des Headers und umschließt somit den Inhalt und den Footer. Da der Wrapper (um den Footer am Ende der Seite zu halten) eine Höhe von 100% haben muss, verschiebt sich der Footer um die 300px Höhe des Headers nach unten, was natürlich unschön ist.
    Meine eigentliche Intention ist das der Footer immer am Ende der Seite steht und bei längeren Seiten nur sichtbar ist wenn man ganz nach unten scrollt.

    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>Unbenanntes Dokument</title>
    <style>
    
    * {
        margin: 0px;
        padding: 0px;
    }
    
    html, body {
        height: 100%;
    }
    
    header {
        height: 300px;  
        width: 100%;
        background: #F00;
    }
    
    #wrapper { 
        position: relative;
        height: 100%;
        margin: 0 auto; 
        width: 700px; 
    }
    
    
    
    footer {
        background: #00F;
        height: 100px;
        position: absolute;
        width: 100%;
        bottom: 0;
    }
    </style>
    </head>
        <header>
        </header>
            <div id="wrapper">
                <section>
                Cusaperi nosaniendam, simoluptam quost, et quati dolor aut ma consedi volorro et pererio temquis dolum fugiaspellam quaerum corio. Itiniti illeceperi audae sam fuga. Ut rem rem ilicimp elentet laborum andentibus plaut adi comniet elis porrorum ea vid quae. Nequia alit fuga. Lupis aliquam, utam, atatenis est esto eossit que latatae cuptati consequam con num is velitiore comnim il int at estrume magnimus, tem fuga. Nequidus ium et et et officieniet quoditi unt offictate elit unt que imilit ium endit vit andio quam ut quis ut volum quo mil ium voluptatum ut occust la veriore voluptassit quae consequat ipsumqu ossinci enihiliquat ad que dolupiet laborae culpa conse iduntem qui debitem porenec ercius, untoreh enimet volorep edictur mo berchilitio eost rerumquo odignatur aut et isquia sumquidest quis qui necea sit verumqui optur, ex erchici mustia alitinis veliatus et, officias acienda nosant.
    Evel iligniandes as et voluptatus, oditatur asped mo qui il magnihil ilitatis reium asped ut de latur ab id maximi, volesequate pernatis dolorro et andae estiis net, que sum idem quibusda nestrunt por sequas modionse exeriasped est od qui core pa ipit quunt pratem eaquoditam aliqui undunt quas alit que nobis endit ent venis es nestrum et, quae voluptatis erumet autentur, alitate quam, erumquam quidunt magnim re, sint ducient quias ullam quibus eos nita aut exeribe arumquunt eveleste vel iliquidis volupta spelestem iumet acias aut rest voluptius magnatem. Ucienias doluptatur, ommos delendae. Ihilluptas sunt ea autecaturepe consedi pictore aut evel mo ventist, inis denieni magnatus dolupta tionsed eossimuscid quistem aut dolor autenitas nobis in conem. Neque voluptati temquatum consed qui tecepelene velluptati bearum qui corporehenet minum que volor re non rae. Cias doluptius atemporibus, que dolestia ni cus dolleceaquam volora dolo te ni as est que estet et doluptur, nus aut il im raerum apientiosam, tem labori velique que eume omnime vidunt fugianis nus, quasperum venim fugitat esciusdam sitem faccuptatur? Elendi con corem a volumqui tecae eos modi cullit, conseque sit et pa quameni hillorio blaborro berupic ipsandebis quo te occus sequian dernat mil maiorehenimo blaci
                </section>
                <footer>
                </footer>
            </div>
    <body>
    </body>
    </html>
    Achtung: Dies ist ein alter Thread im HTML und Webmaster Forum
    Diese Diskussion ist älter als 90 Tage. Die darin enthaltenen Informationen sind möglicherweise nicht mehr aktuell. Erstelle bitte zu deiner Frage ein neues Thema im Forum !!!!!

  2. #2
    Prinz(essin)
    Registriert seit
    26.03.2013
    Beiträge
    835
    Danke
    20
    Bekam 76 mal "Danke" in 75 Postings

    Standard AW: Header/Footer Problem

    Bitte die Forenregeln beachten.
    Keine Crossposting erstellen -> http://xhtmlforum.de/69907-header-footer-problem.html

Ähnliche Themen

  1. header und footer in html
    Von soup im Forum PHP Forum - Apache - CGI - Perl - JavaScript und Co.
    Antworten: 19
    Letzter Beitrag: 21.08.2012, 14:29
  2. Problem mit Sticky Footer
    Von Junky5 im Forum HTML & CSS Forum
    Antworten: 5
    Letzter Beitrag: 26.06.2012, 22:11
  3. Problem mit Footer
    Von micronix im Forum HTML & CSS Forum
    Antworten: 11
    Letzter Beitrag: 01.07.2010, 12:50
  4. Problem mit FOOTER-Positionierung
    Von Billbos im Forum HTML & CSS Forum
    Antworten: 2
    Letzter Beitrag: 31.01.2009, 15:46
  5. header und footer bei html
    Von im Forum HTML & CSS Forum
    Antworten: 8
    Letzter Beitrag: 31.01.2005, 20:18

Stichworte

Berechtigungen

  • Neue Themen erstellen: Nein
  • Themen beantworten: Nein
  • Anhänge hochladen: Nein
  • Beiträge bearbeiten: Nein
  •