 Willkommen auf dem Portal für Mediengestalter
|
|
|
| Autor |
Nachricht |
VonStrago
Threadersteller
Dabei seit: 18.08.2006
Ort: Stuttgart / Bangkok
Alter: -
Geschlecht: -
|
Verfasst Mi 28.05.2008 11:28
Titel IE7 Footer? Force Redraw? oder Neues CSS Konzept? |
  |
|
Hallo Forum,
Wahrscheinlich bekommen einige Wuergattacken wenn die Reizwoerter FOOTER und UNTEN auftauchen, aber mein Problem ist nicht, dass ich den Footer nicht dazu bekomme immer am unteren Bildrand zu erscheinen, wenn der Inhalt nicht aussreicht um den Screen zu fuellen, oder aber den Footer unter dem Inhalt aufzutauchen zu lassen wenn dieser besagte Inhalt den Screen fuellt (zum bsp nach dem Scrollen).
Mein Aufbau ist der "Standart Footer": wrapper (div) mit height:100%; (ebenso body und html mt je 100%), content (div) der floated (in diesem fall 2 leftbox und der Hauptcontent), danach ein stopper (div) mit clear:both und dann das Problemkind: footer (div) mit position absolute, bottom:0px ect.
tut auch PERFEKT in IE6 und FF,
ABER nicht in IE7 !!! ARGHHHH  zum Harre ausreissen, da er eigenltich doch funktioniert, man muss halt immer per Hand auf den reload button druecken wenn man den Fenster verkleiner bzw vergroessert!
schauts mal unter:
http://www.vonstrago.com/temp/acc_test/template.htm
es muss irgend ein skuriles Problem mit redraw sein, der ie7 kommt nicht auf die idee das sich bottom=0px sich veraendert wenn man den das Fenster per resize vergroessert und passt dies dann nur an, wenn man halt den refresh button drueckt...
waere super wenns irgendwie ohne javascript (force redraw on resize???) klappt, vielleicht ist es halt doch nur irgendwo ein falsch gesetztes height:100%... viellecht ... hoffentlich...
freu mich auf Input und danke im vorraus fuer die Hilfe.
cheers
|
|
| |
   |
 |
Kash
Dabei seit: 07.11.2002
Ort: Schopfheim
Alter: 41
Geschlecht: 
|
Verfasst Mi 28.05.2008 11:32
Titel
|
|
|
das selbe problem habe ich bei 2-3 projekten auch.
bei GMX bestand das problem auch mal einige Zeit lang.
Ich hoffe dir wird geholfen, aber dazu solltest du auch Code posten.
|
|
| |
|
|
|
Anzeige
|
|
|
VonStrago
Threadersteller
Dabei seit: 18.08.2006
Ort: Stuttgart / Bangkok
Alter: -
Geschlecht: -
|
Verfasst Mi 28.05.2008 11:48
Titel
|
|
|
Der code ist halt einiges, aber natuerlich post ich den gerne
die html datei:
| Code: |
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Template</title>
<link href="css/template_css.css" rel="stylesheet" type="text/css" media="screen" />
<script type="text/javascript">
sfHover = function() {
var sfEls = document.getElementById("nav").getElementsByTagName("li");
for (var i=0; i<sfEls.length; i++) {
sfEls[i].onmouseover=function() {
this.className+=" sfhover";
}
sfEls[i].onmouseout=function() {
this.className=this.className.replace(new RegExp(" sfhover\\b"), "");
}
}
}
if (window.attachEvent) window.attachEvent("onload", sfHover);
</script>
</head>
<body>
<div id="wrapper">
<div id="headbox">
<div id="logobox"><img src="images/logo.jpg" alt="Allied Carbon Credit" width="101" height="150" /></div>
</div><!--// end of headbox //-->
<div id="leftbox">
<div id="inner_leftbox">leftbox
<p>Please resize the browser window to st nonummy vestibulum arcu. Nulla eros eros, mattis et, dictum quis, convallis vel, mauris. Ut sed mauris vel metus pretium pretium. Curabitur tristique sem id justo. Nunc sit amet felis. Duis luctus pharetra urna. Sed enim arcu, cursus a, posuere sed, sollicitudin in, justo. Pellentesque enim lacus, egestas ut, elementum eu, molestie vel, urna. Integer quam. Phasellus tempor. Sed commodo porttitor justo. Vestibulum rhoncus lacinia pede. Aliquam lectus velit, auctor a, fermentum a, accumsan et, neque.</p>
</div>
</div><!--// end of leftbox //-->
<div id="contentbox">
<div id="menubox">
<ul id="nav">
<li><a href="#">Allied Carbon Credit GmbH</a>
<ul>
<li><a href="#">Our Company</a></li>
<li><a href="#">Our Professionals</a></li>
<li><a href="#">Management</a></li>
</ul>
</li>
<li><a href="#">The company group</a>
<ul>
<li><a href="#">Company structure</a></li>
<li><a href="#">Portfolio Companies</a></li>
</ul>
</li>
<li><a href="#">The Carbon Market</a>
<ul>
<li><a href="#">Kyoto protocol</a></li>
<li><a href="#">CMD</a></li>
<li><a href="#">CMD timeline</a></li>
<li><a href="#">JI</a></li>
<li><a href="#">ETS</a></li>
<li><a href="#">VER</a></li>
</ul>
</li>
<li><a href="#">Creating emission reductions</a>
<ul>
<li><a href="#">Our services</a></li>
<li><a href="#">Working with ALLIED</a></li>
<li><a href="#">Our projects</a></li>
</ul>
</li>
<li><a href="#">Our sector experience</a>
<ul>
<li><a href="#">Waste water</a></li>
<li><a href="#">Landfill gass</a></li>
<li><a href="#">Energy efficiency</a></li>
<li><a href="#">Energy production</a></li>
<li><a href="#">Metall production</a></li>
</ul>
</li>
<li><a href="#">Technology</a>
<ul>
<li><a href="#">Monitoring</a></li>
<li><a href="#">Techology supply</a></li>
</ul>
</li>
<li><a href="#">Project financing </a>
<ul>
<li><a href="#">Emission trading</a></li>
<li><a href="#">Investment</a></li>
<li><a href="#">Financing models</a></li>
</ul>
</li>
<li><a href="#">Contact information</a>
<ul>
<li><a href="#">Working at ALLIED</a></li>
<li><a href="#">Contact us</a></li>
<li><a href="#">Site map</a></li>
<li><a href="#">Impressum</a>
<ul>
<li><a href="#">Impressum 01</a></li>
<li><a href="#">Impressum 02</a></li>
</ul>
</li>
</ul>
</li>
</ul>
</div><!--// end of menubox //-->
<div id="inner_contentbox">contentbox
<p>Please resize the browser window to see how your 100% CSS footer behaves.Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Cras porttitor. Ut nonummy vestibulum arcu. Nulla eros eros, mattis et, dictum quis, convallis vel, mauris. Ut sed mauris vel metus pretium pretium. Curabitur tristique sem id justo. Nunc sit amet felis. Duis luctus pharetra urna. Sed enim arcu, cursus a, posuere sed, sollicitudin in, justo. Pellentesque enim lacus, egestas ut, elementum eu, molestie vel, urna. Integer quam. Phasellus tempor. Sed commodo porttitor justo. Vestibulum rhoncus lacinia pede. Aliquam lectus velit, auctor a, fermentum a, accumsan et, neque.</p>
<p>Please resize the browser window to see how your 100% CSS footer behaves.Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Cras porttitor. Ut nonummy vestibulum arcu. Nulla eros eros, mattis et, dictum quis, convallis vel, mauris. Ut sed mauris vel metus pretium pretium. Curabitur tristique sem id justo. Nunc sit amet felis. Duis luctus pharetra urna. Sed enim arcu, cursus a, posuere sed, sollicitudin in, justo. Pellentesque enim lacus, egestas ut, elementum eu, molestie vel, urna. Integer quam. Phasellus tempor. Sed commodo porttitor justo. Vestibulum rhoncus lacinia pede. Aliquam lectus velit, auctor a, fermentum a, accumsan et, neque.</p>
</div>
</div><!--// end of contentbox //-->
<div id="rightbox"> </div><!--// end of rightbox //-->
<div id="bottombox">
<div id="bottom_menu">
<ul id="bottomnav">
<li><a href="#">Imprint</a></li>
<li><a href="#">Disclaimer</a></li>
<li><a href="#">Sitemap</a></li>
<li><a href="#">Log In</a></li>
</ul>
</div>
<div id="disclaimer">Copyright 2008 Allied Carbon Credit GmbH</div>
</div><!--// end of bottombox //-->
</div><!--// end of wrapper //-->
</body>
</html>
|
und das CSS:
| Code: |
@charset "utf-8";
/* CSS Document ACC */
html,body {margin:0; padding:0; height:100%; border:none;}
body {background:url(../images/bg_gradient.gif) repeat-x #dceff6 top; line-height:normal;
font-family:"Times New Roman", Times, serif; font-size:12px; font-weight:normal; color:#000;}
#wrapper {background:url(../images/bg_faux.gif) repeat-y center; min-height: 100%; width:940px; height:auto!important; height:100%;/* */
position:relative; top:0px; left:50%; margin-left:-470px;}
#headbox {background:url(../images/bg_header.jpg) no-repeat top left; width:940px; height:225px; margin:0px 0px 0px 0px; padding:0px 0px 0px 0px;}
#logobox {width:101px; height:180px; margin:0px 0px 0px 0px; padding:45px 0px 0px 69px;}
#leftbox, #contentbox {float:left; display:inline;}
#leftbox {width:210px; margin:0px 0px 0px 0px; padding:0px 0px 45px 0px; background:url(../images/bg_sideshadows.gif) left top no-repeat;}
#inner_leftbox { width:auto; margin:6px 5px 0px 26px; padding:0px 0px 0px 0px;}
#menubox {height:64px; width:710px;}
#contentbox {width:730px; margin:0px 0px 0px 0px; padding:0px 0px 45px 0px; background:url(../images/bg_sideshadows.gif) right top no-repeat;}
#inner_contentbox { width:auto; margin:0px 70px 0px 50px; padding:0px 0px 0px 0px;}
#rightbox { clear:both;}
a:link, a:visited {text-decoration:none; color:#fff;}
/*list navigation version alistapart*/
/*nur topnavigation*/
#nav, #nav ul { padding:0; margin:0; list-style:none;}
#nav a { display: block; width:174px; height:19px; text-align:left; padding-top:2px}
#nav li { float: left; width: 179px; height:25px; background:#d3cfcf; display:inline;}
/*2nd list the dropdown move away*/
#nav li ul { position: absolute; width: 180px; left: -999em;}
/*2nd list the dropdown move back and the ie fix with the sfhover class*/
#nav li:hover ul, #nav li.sfhover ul {left: auto;}
/*3rd list slides out on the left side*/
#nav li ul ul {margin: -23px 0 0 177px;}
/*2nd list the dropdown move away*/
#nav li:hover ul ul, #nav li.sfhover ul ul {left: -999em;}
/*3rd list the dropdown move back and the ie fix with the sfhover class*/
#nav li li:hover ul, #nav li li.sfhover ul {left: auto;}
/*COSMETIC*/
#nav a:link, #nav a:visited, #nav a:hover {color:#fff; text-align:center; vertical-align:middle;}
#nav {margin-left:2px; display:inline; /*stupid ie*/}
#nav li {margin-left:-2px; padding-left:0px; margin-bottom:7px;}
#nav li a {margin:2px 0px 0px 2px; background:url(../images/bg_greennav.jpg) no-repeat;}
#nav li a:hover {background:url(../images/bg_brightgreennav.jpg) no-repeat;}
#nav li ul {padding-top:2px;}
#nav li li {margin-top:-2px; margin-left:0px;margin-bottom:0px;}
#nav li li a {background:url(../images/bg_bluenav.jpg) no-repeat;}
#nav li li a:hover {background:#186a8b url(../images/arror.gif) no-repeat -130px 1px;}
#nav li li li a {background:url(../images/bg_brightbluenav.jpg) no-repeat}
#nav li li li a:hover {background:#186a8b url(../images/arror.gif) no-repeat -130px 1px;}
/*Problemkind footer*/
#bottombox {background:url(../images/bg_footer.gif) bottom center no-repeat;
position:absolute; bottom:0px; width:940px; padding:0px 0px 0px 0px; height:48px; display:block;}
/*nur inhalt*/
#bottom_menu {width:710px; margin:0px 0px 0px 210px; height:25px; padding:0px;}
#disclaimer {text-align:center; font-family:"Times New Roman", Times, serif; font-size:12px; color:#3fb0de; padding-top:3px; height:20px; margin:0px 0px 0px 0px;}
#bottomnav, #bottomnav ul { padding:0; margin:0; list-style:none;}
#bottomnav a:link, #bottomnav a:visited, #bottomnav a:hover {color:#fff; text-align:center; vertical-align:middle;}
#bottomnav a { display: block; width:174px; height:19px; text-align:left; padding-top:2px}
#bottomnav li { float: left; width: 179px; height:25px; background:#d3cfcf; display:inline;}
#bottomnav a:link, #bottomnav a:visited, #bottomnav a:hover {color:#fff; text-align:center; vertical-align:middle;}
#bottomnav {margin-left:2px; display:inline; /*stupid ie*/}
#bottomnav li {margin-left:-2px; padding-left:0px; margin-bottom:0px;}
#bottomnav li a {margin:2px 0px 0px 2px; background:url(../images/bg_fadesbluenav.jpg) no-repeat;}
#bottomnav li a:hover {background:url(../images/bg_fadedbrightbluenav.jpg) no-repeat;}
|
fuer die schoen variante: http://www.vonstrago.com/temp/acc_test/template.htm wie gesagt formvollendete schoenheit" in ie6 und ff ...
ich hab mal den gesammten schmonz reinkopiert, vielleicht ist das problem ja ein teil des hover javascripts vom suckerfish menu, doct type oder was GANZ anderes, obwohl ich es nicht glaube ... (then again microsoft moves in mysterious ways)...
thx for answers
p.s der besagte stopper (div) mit clear:both ist in diesem fall die rightbox
|
|
| |
|
|
VonStrago
Threadersteller
Dabei seit: 18.08.2006
Ort: Stuttgart / Bangkok
Alter: -
Geschlecht: -
|
Verfasst Mo 02.06.2008 13:19
Titel
|
|
|
hab das problem mit hilfe aus einem anderem forum geloest bekommen.
lag am "wrapper" positon:relative. muss ein positon:absolute sein, weiterhin musste ich durch ein "display: inline-block;" ein sogenanntes "hasLayout" (IE/Win proprietary konzept) erzeugen... skuril...
hauptsache problem geloest.
cheers
|
|
| |
|
|
Kash
Dabei seit: 07.11.2002
Ort: Schopfheim
Alter: 41
Geschlecht:
|
Verfasst Mo 02.06.2008 13:25
Titel
|
|
|
cool, ich werde das auch mal ausprobieren.
obwohl wie wird der footer beschrieben?
| Code: |
..
position:absolute;
bottom: 0px;
...
|
so?
|
|
| |
|
|
| |
|
|
| Ähnliche Themen |
[Flash MX + PHP] force download im IE?
Footer Probleme
Problem mit Footer
[css] - Footer Problem
css: footer ganz unten? wie?
E.Mail Header/Footer
|
|
|
Du kannst keine Beiträge in dieses Forum schreiben.
Du kannst auf Beiträge in diesem Forum nicht antworten.
Du kannst an Umfragen in diesem Forum nicht mitmachen.
|
|
