✔ Und noch ein IE6 Problem (min-width)

Das ändert aber leider nichts :(

Das mit der min-width klappt wunderbar aber mein Footer ist im IE weiterhin nicht mehr am unteren Rand und der Footer übernimmt die Breite nicht richtig (im IE ist er nur so breit wie der darin zu stehende Text und in Opera schrumpft er mein Verkleinern des Browserfensters weiter auch wenn die 800px erreicht sind).
 
Moin,

in diesem Modell (basierend auf http://www.cssplay.co.uk/boxes/width2.html) hab ich den Footer außerhalb von #box deklariert, damit er sich im IE6 am unteren Fensterrand ausrichten lässt - die hinzugefügten DIV-Blöcke für den min-width-Workaround hatten dies nämlich verhindert.

Das eingebundene JS "IE7.js" (siehe http://code.google.com/p/ie7-js/) dient hier dazu, damit IE6 die kombinierten Positionsangaben (left / right) für den Footer unterstützt, wozu er normalerweise nicht imstande ist.

Desweiteren interpretiert bei mir Opera die Mindestbreite einwandfrei.

HTML: 
<!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=iso-8859-1" />
<title>Test</title>

<link href="style.css" rel="stylesheet" type="text/css">
<!--[if lt IE 7]>
<style type="text/css">
.minwidth {border-left:800px solid #4b0082; position:relative; float:left; z-index:1;}
.container {margin-left:-800px; position:relative; float:left; z-index:2;}
</style>
<script src="http://ie7-js.googlecode.com/svn/version/2.0(beta3)/IE7.js" type="text/javascript"></script>
<![endif]-->

</head>
<body>

<div id="box" class="clearfix"><div class="minwidth"><div class="container">
        <div id="banner_top"></div>
        <div id="banner_bottom_left"></div>
        <div id="banner_bottom_right"></div>
        <div id="banner_bottom_middle"></div>
        <div id="navigation_left" align="left"></div>
        <div id="navigation_right" align="right"></div>
        <div id="main" align="center"></div>
</div></div></div>
<div id="footer" align="center">test</div>

</body>
</html>
CSS: 
#footer {
        background: #0000ff;
        position: absolute;
        height:20px;
        margin-top: -20px;
        left: 160px;
        right: 160px;
}

mfg Maik
 
Um antworten zu können musst du eingeloggt sein.

Neue Beiträge

Zurück