Advanced Search

Float in Float IE6 margin wrong inherted div width Bug

/ Published in: CSS
Save to your folder(s)
Bugfix/Lösungsvorschlag:

Es ist offensichtlich, dass die Zelle mit der ID cell3467 und dem definierten "margin-right: 3.09%" falsch berechnet wird - nämlich mit realen 16 Pixeln anstatt 8 - und auf den obersten Basis-Wert der "DIV width" zurückgreift (100% anstatt 50%). Dabei wird dazwischen die Weite 50% der Gruppe #group1573 übergangen! Somit müssen wir nach dieser Gruppe nochmals eine Ebene (DIV) mit der Weite von 100% (width: 100%) definieren um die richtige Weite von realen 3.09% (8 Px) zu erlangen.

Es muss nun innerhalb der Gruppe nochmals eine Ebene (DIV) mit einer Weite von 100% erstellt werden:

Expand | Embed | Plain Text

Copy this code and paste it in your HTML 
  1. <body>
  2.   <div id="page">
  3.     <div id="content" style="background-color: yellow;">
  4.       <div id="group1573" class="cmsGroup" style="width: 50%; padding: 0%; background-color:red; display:block;">
  5.         <!-- Bugfix for IE6 related margin width -->
  6.      <div style="width: 100%">
  7.         <!-- E: Bugfix -->
  8.        <div id="cell2352" class="cmsCell" style="width: 99.6%; background-color:yellow;">
  9.             <p>Box 1</p>
  10.           </div>
  11.           <div id="cell3467" class="cmsCell" style="width: 22.58%; float: left; background-color: green; margin-right: 3.09%;">
  12.             <div>
  13.               <p>Box 2</p>
  14.             </div>
  15.           </div>
  16.           <div id="cell1574" class="cmsCell" style="width: 73.93%; background-color:#CC9966;">
  17.             <p>Box 3</p>
  18.           </div>
  19.         <!-- Bugfix for IE6 related margin width -->  
  20.         </div>
  21.         <!-- E: Bugfix -->
  22.    </div>
  23.     </div>
  24.   </div>
  25. </body>

URL: http://cms4.blogspot.com/2008/05/float-in-float-ie6-margin-wrong.html

Report this snippet


Comments

RSS Icon Subscribe to comments

You need to login to post a comment.