zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > CSS
Seite neu laden Hilfe: IE zerschießt Layout

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 01.06.2006, 07:25
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 24.03.2006
Beiträge: 10
Paulinche befindet sich auf einem aufstrebenden Ast
Standard Hilfe: IE zerschießt Layout

Guten morgen zusammen!

Ich habe wieder einmal ein Problem auf dessen Lösung ich beim besten Willen nicht kommen will.
Ich habe ein dreispaliges Layout, in wessen linker Spalte #left ein Iframe eingefügt ist. Der Iframe hat Höhe 100% des ihn umgebenden Containers (#left).
Im FF bleibt der Frame wo er sein soll, im IE6 "hüpft" der gesammte Container (#left) spontan zentral in die Mitte. Das passiert vorallem, wenn man in der Spalte #right per hover über einen Link fährt.

Mein #left ist wie folgt für den IE in der style.css angegeben:


Code:
/*** IE6 Fix ***/
* html #left {
  left: 178px;           
}
hier die normalen Werte für #left:
Code:
#left {
  position: relative;
  float: left;
  width: 176px;          
  right: 176px;          
  margin-left: -100%;
  height:100%;
  border-right: 1px solid #CCCCCC;
  border-left: 1px solid #CCCCCC;
  color: #000000;
  background-color:#FFFFFF;
}
hier der wichtigste Teil der style.css:

Code:
body {
  background-color: #eeeeee;
  color: #000000;
  margin: 			0px auto;
  min-width: 550px;      
  height:622px;
  width:1000px;
  font-family:Verdana, Arial, Helvetica, sans-serif;
  font-size: 80%;
  font-style:normal;
}
			
#header {
  color:#EEE;
  background-color:#FFFFFF;	
  min-width: 550px;     
  margin: 			0px auto;
  height:170px;
  width:996px;
  background-image: url(../pics/header/abstrakt.jpg);
  border-right: 2px solid #CCCCCC;
  border-left: 2px solid #CCCCCC;
  }
  

#container100 {  
  color: #000000;
  background-color:#FFFFFF;
  padding-left: 176px;   /* LC width */
  padding-right: 178px;  /* RC width */
  font-family:Verdana, Arial, Helvetica, sans-serif;
  font-size: 100%;
  height:100%;
}

#container .column {
  position: relative;
  float: left;
}
#center {
  position: relative;
  float: left;
  width: 100%;
  height:100%;
  color: #000000;
  background-color:#FFFFFF; 
}

#left {
  position: relative;
  float: left;
  width: 176px;          /* LC width */
  right: 176px;          /* LC width */
  margin-left: -100%;
  height:100%;
  border-right: 1px solid #CCCCCC;
  border-left: 1px solid #CCCCCC;
  color: #000000;
  background-color:#FFFFFF;
}
#right {
  position: relative;
  float: right;
  width: 176px;          /* RC width */
  margin-right: -178px;  /* RC width */
  border-right: 1px solid #CCCCCC;
  border-left: 1px solid #CCCCCC;
  height:100%;
  color: #000000;
  background-color:#FFFFFF;
}
/*** IE6 Fix ***/
* html #left {
  left: 178px;           /* RC width */
} 
 * html #right {
  right: 178px;           /* LC width */
} 
#footer {
  clear: both;
  position:relative;
  height:22px;
  width:998px;
  border: 1px solid #CCCCCC;
  color: #000000;
  background-color:#FFFFFF;
  padding-top:			0px;
}
Hier der Link zur Seite


Wenn ich die Seite im IE aktualisiere "hüpft" der Container wieder nach links auf seinen ihm zugeteilten Platz.
Hat jemand eine Erklärung und, noch besser, eine Lösung für dieses Problem?
Leider habe ich noch nicht soviel Erfahrung mit css, deswegen nicht hauen wenns etwas einfaches ist.
Im Anhang findet ihr die style.css

Danke für die Hilfe im Voraus!
Angehängte Dateien
Dateityp: zip style.zip (3,0 KB, 0x aufgerufen)
__________________
WebmasterStart.org - die besten Seiten für Webmaster/Designer übersichtlich in einer Liste
Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 01.06.2006, 15:12
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 20.02.2005
Beiträge: 1.045
Tigereye befindet sich auf einem aufstrebenden Ast
Standard

Der einzige Tipp, der mir auf Anhieb einfällt: Lass den Iframe weg! Die machen ständig Probleme, nicht nur im IE. Wenn du einen Teil der Seite auslagern willst, machst du das am besten serverseitig mit PHP oder SSI.
__________________
* {margin:0; padding:0; }
Mit Zitat antworten
Sponsored Links
  #3 (permalink)  
Alt 02.06.2006, 10:33
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 24.03.2006
Beiträge: 10
Paulinche befindet sich auf einem aufstrebenden Ast
Standard

Danke!

Ich glaube das liegt am holygrail-spalten-layout. Wer noch mal schauen und dann posten.
__________________
WebmasterStart.org - die besten Seiten für Webmaster/Designer übersichtlich in einer Liste
Mit Zitat antworten
  #4 (permalink)  
Alt 02.06.2006, 13:15
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 24.03.2006
Beiträge: 10
Paulinche befindet sich auf einem aufstrebenden Ast
Standard

So, Problem gelöst.

Hier der Lösungsansatz:

http://www.cssplay.co.uk/layouts/3cols2.html

Einfach ausprobieren. Der Aliasapart-Ansatz hat bei mir nicht funktioniert.
__________________
WebmasterStart.org - die besten Seiten für Webmaster/Designer übersichtlich in einer Liste
Mit Zitat antworten
Antwort

Themen-Optionen
Ansicht

Forumregeln
Es ist Ihnen nicht erlaubt, neue Themen zu verfassen.
Es ist Ihnen nicht erlaubt, auf Beiträge zu antworten.
Es ist Ihnen nicht erlaubt, Anhänge hochzuladen.
Es ist Ihnen nicht erlaubt, Ihre Beiträge zu bearbeiten.

BB-Code ist an.
Smileys sind an.
[IMG] Code ist an.
HTML-Code ist aus.
Trackbacks are an
Pingbacks are an
Refbacks are aus


Ähnliche Themen
Thema Autor Forum Antworten Letzter Beitrag
Bitte um Layout hilfe gunnar_hst CSS 0 20.06.2010 14:57
Layout selbst coden - Hilfe ! kgsbm CSS 3 25.03.2008 19:25
Hilfe bei gesamten CSS Layout mexxat CSS 0 22.08.2007 13:40
Brauche Hilfe beim 2-Spaltigen Layout Kaimane CSS 1 15.08.2007 00:10
Hilfe beim Layout erstellen kevink CSS 9 24.06.2007 18:13


Alle Zeitangaben in WEZ +2. Es ist jetzt 18:47 Uhr.