Emanuel: Layoutprobleme im IE7 ^2

Beitrag lesen

SELF-Forum

Layoutprobleme im IE7 ^2

Emanuel
– Informationen zu den Bewertungsregeln

Hast du schon versucht, eine zweite CSS-Datei nur für IE7 zu machen?

Versucht nicht, ich denke es geht auch anders (Browserweichen)

Anderer Versuch: direkt nach der Doctype-Definition im Header (also ohne Leerschlag und nichts) <!--IE 7 quirks mode please--> einfügen. Das sollte den IE7 in einen ähnlichen Modus werfen wie den IE6.

Werde ich einmal versuchen, aber es muss einfach auch eine "normale" Lösung geben!

Also ich habe jetzt eine Möglichkeit gefunden du, die zumindest bei mir funktioniert und meine Anforderungen erfüllt. Funktioniert in aktuellstem FF, Opera, Safari, Netscape, Mozilla, IE6 und IE7 (ich will, dass meine Seite  möglichst bei allen Browsern funktioniert und gleich aussieht).

Das Problem bei mir war bzw. ist, dass solang ich keine paddings angebe (Innenabstände der divs) passt es an sich. Sobald ich aber bei 'left, content, right' paddings angebe verzieht sich alles, auch wenn ich durch modifizieren der 'width' und den 'margins' diesem entgegenwirken will (was ja auch bei FF, IE6 u.a. funktioniert, ausser bei IE7 und Safari).

Ich habe jetzt kurzerhand 'dummy divs' gemacht (gleicher code wie beim ersten Posting, ich poste nur die Uterschiede):

  
<style type="text/css">  
.  
.  
.  
/* MAIN */  
  
.main{  
 padding-left:9em;  
 padding-right:9em;  
}  
  
.left_dummy{  
 position:relative;  
 float:left;  
 width:9em;  
 margin-left:-9em;  
}  
  
/*** IE6 Fix ***/  
* html .left_dummy {  
 left:9em;  
}  
  
.content_dummy{  
 position:relative;  
 float:left;  
 width:100%;  
}  
  
.right_dummy{  
 position:relative;  
 float:left;  
 width:9em;  
 margin-right:-9em;  
}  
  
.left{  
 background:red;  
 padding:1em 1em;  
}  
  
.content{  
 background:brown;  
 padding:1em 2em;  
}  
  
.right{  
 background:yellow;  
 text-align:right;  
 padding:1em 1em;  
}  
.  
.  
.  
</style>  
.  
.  
.  
<div class="main">  
  <div class="left_dummy">  
   <div class="left">  
    left  
   </div>  
  </div>  
  <div class="content_dummy">  
   <div class="content">  
    content  
   </div>  
  </div>  
  <div class="right_dummy">  
   <div class="right">  
    right  
   </div>  
  </div>  
 </div>  
.  
.  
.  
</html>

Die 'dummy divs' sind quasi meine Platzhalter, mit denen definiere ich das Grundgerüst (keine padding Angaben). Als nächstes pflanze ich in diese 'dummy divs' die eigentlichen 'left, center, right' divs von vorher. Bei den eingepflanzten Divs kann ich paddings angeben, ohne dass mir der IE7 wieder herumspinnt.

Wahrscheinlich hattest du so eine Idee schon, aber vielleicht konnte ich anderen behilflich sein! ;)

MfG Emanuel

Beitrag melden
–
Informationen zu den Bewertungsregeln