Hi Ich habe ein Problem mit der Codierung meines Layouts. Ich möchte, dass meine Seitenleiste unabhängig von der Bildschirmgröße gleich bleibt, aber mein Inhaltsbereich muss flüssig sein. Die Kopfzeile bleibt oben, was ich will, das Problem ist die Fußzeile, die ich brauche, um immer unten zu bleiben, und die volle Breite des Inhaltsbereichs. Wenn jemand helfen kann, wäre es sehr dankbar.

Hier ist mein Code.

html, body { 
    height: 100%; 
    margin: 0;
}   

#content { 
    width: 100%; 
    height: 100%;
}   

#left { 
    width: 20%; 
    height: 100%; 
    float: left; 
    background-color: red; 
}   

#right { 
    float: left; 
    width: 80%; 
    height: 100%;  
    background-color: green;
} 

#right header { 
    background: blue;
    text-align: center;
    color: white;
    padding: 20px;
}

#right footer {
    background: brown;
    text-align: center;
    color: white;
    position: absolute;
    bottom: 0;
    width: 80%;
}

<div id='content'>   
    <div id='left'>Testing</div>   
    <div id='right'>
        <header>TITLE</header>
        <div class="content">
            <p>lorem ipsum and the like.</p>
        </div>	
        <footer>FOOTER</footer>
    </div>
</div>