XHTMLforum

XHTMLforum (http://xhtmlforum.de/index.php)
-   CSS (http://xhtmlforum.de/forumdisplay.php?f=73)
-   -   FooterStickAlt - Zentrieren? (http://xhtmlforum.de/showthread.php?t=52919)

MrPutty 29.07.2008 13:11

FooterStickAlt - Zentrieren?
 
Ich versuche verzweifelt ein Layout auf der 'FooterStickAlt' Basis mittig zu zentrieren. Bei jedem Versuch, wird der Footer-Effekt wieder zerstört.

Sollte das 'FooterStickAlt' Konstrukt einen Container bekommen? Mir scheint, ich hab ein dickes Brett vor'm Kopf!

Gruß, Putty

Code:

<!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="de" lang="de">

<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Dokument</title>
<link rel="stylesheet" href="test.css" type="text/css" title="Default Style" />
</head>

<body>
<html>
<body>
  <div id="center">
    <div id="nonFooter">
      <div id="wrapper">pp</div>
    </div>
    <div id="footer">Foot</div>
  </div>
</body>
</html>

Code:

* {
margin: 0;
padding: 0;
}
html
{
height: 100%;
}

body
{
height: 100%;
}

#nonFooter
{
position: relative;
min-height: 100%;
width:960px;
background-color: #f0ff00;
}

* html #nonFooter
{
height: 100%;
}

#wrapper
{
padding-bottom: 9em;
background-color: #00ff00;
}

#footer
{
position: relative;
margin-top: -83px;
height: 83px;
width:960px;
background-color: #0000f0;
}


fricca 29.07.2008 13:18

Wenn du um #nonFooter und #footer einen weiteren Container legst, benötigt auch dieser height:100%.

MrPutty 29.07.2008 13:51

Danke für den Hinweis! Hier noch meine Lösung, vieleicht hilft's jemandem:

- Wrapper mit 100% height (thx@fricca)
- Wrapper mit text-align:center im body tag zentrieren (IE)
- Wrapper mit fester breite versehen und mit margin:0 auto; zentrieren. (FF)

So hat's nun doch geklappt :thumbsup:


Alle Zeitangaben in WEZ +2. Es ist jetzt 08:38 Uhr.

Powered by vBulletin® Version 3.8.11 (Deutsch)
Copyright ©2000 - 2024, vBulletin Solutions, Inc.

© Dirk H. 2003 - 2023