hoi,
schaumal meine Beispiele:
version 1
http://inix.in.funpic.de/stfooter.htmlversion 2
http://inix.in.funpic.de/stickself.htmlHF,
Inita
Danke für Links, ich habe die Links von deiner Seite genutzt und den CSS-Code von http://ryanfait.com/sticky-footer/layout.css angepasst und es geht jetzt auch mit 2 Spalten im Mittelteil. Danke! Der Übersicht halber hier nochmal mein Code der jetzt in IE und FF funktioniert:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<title>A CSS Sticky Footer</title>
<style type="text/css">
* {
margin: 0;
}
html, body {
height: 100%;
}
.header {
height:150px;
width: 990px;
margin-left: auto;
margin-right: auto;
background: #CCCC99;
border-top: 1px solid #C0C0C0;
border-bottom: 1px solid #C0C0C0;
}
.wrapper {
min-height: 99%;
height: auto !important;
height: 99%;
margin: 0 auto -50px; /* the bottom margin is the negative value of the footer's height */
width: 990px;
margin-left: auto;
margin-right: auto;
border-left: 1px solid #C0C0C0;
border-right: 1px solid #C0C0C0;
}
.inhalt {
float: left;
padding: 5px;
width: 770px;
margin: 0 0 0 0;
overflow:visible;
border: 0px solid #C0C0C0;
}
.info {
float: right;
width: 200px;
margin: 0 0 0 0;
padding: 5px 0 0 5px;
border-left: 1px solid #C0C0C0;
border-bottom: 1px solid #C0C0C0;
}
.footer {
height: 50px;
width: 990px;
margin-left: auto;
margin-right: auto;
background: #CCCC99;
border: 1px solid #C0C0C0
/* .push must be the same height as .footer */
}
.push{
height: 50px;
clear: both;
}
</style>
</head>
<body>
<div class="wrapper">
<div class="header">
<h1>BLABLA</h1>
</div>
<div class="info">
<h2>A CSS sticky footer that just works</h2>
We've all tried to use a <strong>sticky footer</strong> one time
or another, but they never seem to come out right, do they? Well, the
days of a hard to understand CSS-based <strong>sticky footer</strong>
are thankfully over. In just a few simple CSS classes with minimal
extra HTML markup, I've fashioned a <strong>sticky footer</strong>
that even beginners can get a handle on. It's been tested in IE 5 and
up, Firefox, Safari and Opera.
</div>
<div class="inhalt">
<h2>Usage of the CSS</h2>
<p><q>Great! this is exactly what I'm looking for! Can I use it?</q></p>
Absolutely. There are no terms, licenses, fees or requirements. Use it as you will.
If you find the kindness to link to me on your site, I'd appreciate it, but it's by
no means necessary. Have fun, and don't be afraid to ask me any questions or
send me your thoughts.
dsg4ewt4et<br>
TEST<br>
sdgsfg<br>
dsg4ewt4et<br>
TEST<br>
sdgsfg<br>
dsg4ewt4et<br>
TEST<br>
sdgsfg<br>
dsg4ewt4et<br>
</div>
<div class="push"></div>
</div>
<div class="footer">
<p>Copyright © 2006-2007 Ryan Fait | All rights reserved.<br />
You may not reproduce this example without written permission from Ryan Fait</p>
</div>
</body>
</html>