nun zu meinem problem... ich habe endlich meine erste css-gestaltete seite am laufen (auf basis von joomla). mein problem stellt nun der ie7 dar. in firefox und früheren ie's wird die seite korrekt angezeigt. die darstellungsprobleme beziehen sich lediglich auf den footer, welcher im ie7 nicht am ende der seite sondern mittendrin angezeigt wird.
in der index.php meines template-ordners habe ich nun eine abfrage für den ie7 eingefügt, damit hierfür eine andere css-datei gezogen wird (dies funktioniert einwandfrei):
- Code: Alles auswählen
<!--[if IE 7.0000]>
<?php echo "<link rel=\"stylesheet\" href=\"$GLOBALS[mosConfig_live_site]/templates/$GLOBALS[cur_template]/css/ie7.css\" type=\"text/css\"/>" ; ?>
<![endif]-->
nun verzweifle ich jedoch etwas, weil sich im ie7 die floats nicht sauber clearen lassen und das wohl auch der grund für den unsauber dargestellten footer sein wird. der body meiner seite ist wie folgt aufgebaut:
- Code: Alles auswählen
<body>
<div id="centerpage">
<div id="header">
</div>
<div id="left_outer">
<div id="left_inner">
<?php mosLoadModules ( 'left', -2 ); ?>
</div>
</div>
<div id="content_outer">
<div id="pathway_text">
</div>
<div id="content_inner">
<?php mosMainBody(); ?>
</div>
</div>
</div>
<div id="footer">
<?php include_once( $GLOBALS['mosConfig_absolute_path'] . '/includes/footer.php' ); ?>
<?php mosLoadModules( 'debug', -1 );?>
</div>
</body>
die für das layout wichtigen punkte in der css-datei sehen folgendermaßen aus:
- Code: Alles auswählen
html {
height:100%;
}
body {
height:100%;
font-family:Verdana, Arial, sans-serif;
font-size:11px;
margin:0px;
padding:0px;
background: #cccccc url(../images/site_bg.jpg) repeat-y top center;
}
#centerpage {
height:100%;
width:900px;
margin-left:auto;
margin-right:auto;
margin-top: 0px;
margin-bottom: 0px;
background: #cccccc url(../images/site_bg.jpg) repeat-y top center;
}
#header {
padding:0px;
margin:0px;
width:900px;
height:180px;
background:url(../images/header.jpg) no-repeat;
}
#left_outer {
width: 159px;
float: left;
margin:0px;
background-color: #bbbbbb;
}
#left_inner {
padding:0px;
}
#content_outer {
float:right;
width:741px;
}
#content_inner{
padding: 15px 25px;
margin: 0px;
background-color:#c0c39b;
}
#footer {
clear:both;
height:15px;
width:900px;
background: url(../images/subhead_bg.png) repeat-x;
margin-left:auto;
margin-right:auto;
}
#pathway_text {
background: url(../images/subhead_bg.png) repeat-x;
height:21px;
border:0px solid #ccc;
}
#pathway_text img {
margin-left: 5px;
margin-right: 5px;
margin-top: 6px;
}
meine frage ist nun wie ich die css-befehle in der ie7.css-datei abändern muss, damit der footer auch im ie7 am ende der seite dargestellt wird. ich zerbreche mir nun seit zwei tagen den kopf und finde einfach keine lösung. ich hoffe ihr habt eine.
lg
citycobra
