<div> randlos im IE wie auch im FF

terravotion

Erfahrenes Mitglied
Hallo alle
Ich habe folgendes Problem:

Der FF zeigt es so an wie ich das gerne hätte =)
Rundum ist alles randlos, während der IE mir auf allen Seiten hässliche Abstände hinmacht.

Der Code des HTML-Files:
HTML:
<div id="background_controller">
    <div id="background_pattern">
    </div>
</div>

<div id="container">
	<div id="left_seperator">
	</div>

	<div id="shower">
                <div id="top_logo">
                </div>
        
                <div id="navigation">
                    ###navigation###
                        <!-- hier kommt die Navigation hin -->
                    ###navigation###
                </div>

                <div id="subnavigation">
                    ###subnavigation###
                        <!-- hier kommt die Subnavigation hin -->
                    ###subnavigation###
                </div>
        
        
                <div id="content">
                        ###content###
                                <!-- hier kommt der Inhalt hin -->
                        ###content###
                </div>
        </div>	
	
	<div id="right_seperator">
	</div>
    
    <div id="footer">
    </div>
</div>

Der betroffene Code des CSS:
Code:
#background_controller {
	position:fixed;
	
	vertical-align:top;
	
	width:100%;
	height:100%;
	
	top:0px;
	bottom:0px;
	left:0px;
	right:0px;
	
	background-image:url(../images/webbackground.png);
	background-repeat:repeat-x;
}



#background_pattern {
	position:fixed;

	width:100%;
	height:100%;

	z-index:2;


	top:0px;
	bottom:0px;
	left:0px;
	right:0px;
	

	background-image:url(../images/background.png);
	background-repeat:repeat;
}

Mag sein, dass das auch nicht der optimale Weg ist das zu lösen, aber nur so hab ich das bis hierhin geschafft^^


Herzlichen Dank und liebe Grüsse!
 
Hi,

Wichtig: Bei CSS-Problemen mit dem IE bitte die Version angeben

Und von welcher IE-Version ist hier die Rede?

Ich frag nur, weil position:fixed in der IE-Familie erst seit dem IE7 unterstützt wird.

Wird denn das HTML-Dokument den Browsern im standardkonformen Modus übergeben?

Im Quirksmodus verhalten sich nämlich der IE7 und IE8, wie ihr Vorgänger, der position:fixed nicht kennt, und daher die festgelegten Positionsangaben ignoriert.

mfg Maik
 
Ich arbeite mit dem IE8, aber Kompatibilität für IE7 wäre gut =)

Öhm, ich habe keine Ahnug was für einen Modus ich verwende...

Code:
<!DOCTYPE html 
	PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

Ich nehme an, dass das den Modus definiert?
 
Bingooo ;-)

Den Darstellungsmodus kannst du ganz einfach mit diesem Script ermitteln:
HTML:
<script type="text/javascript">
alert(document.compatMode);
</script>

Und noch etwas Lektüre zum Thema: Der »DOCTYPE-Switch« und seine Auswirkungen.

Lösung (HTML 4.01):
HTML:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
  "http://www.w3.org/TR/html4/loose.dtd">
oder
HTML:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">


Falls du den IE6 berücksichtigen möchtest, empfehle ich dir http://code.google.com/p/ie7-js/.

mfg Maik
 
Zurück