views:

34

answers:

1

In this article http://www.kashit.org/design/css/ultimate-guide-to-techniques-for-cross-browser-css/

under section "Fixing IE Box Model Bug" author wrote

IE 6 can actually get it right if you are in standards-compliant mode.

Is it mean if we use XHTML 1.0 strict or HTML 5 doctype than this box model problem will get automatically solved without adding this extra div.

default

.box {  
  width:100px;  
  padding:10px;  
   border:2px solid #CCC;  
}

solution for IE6 adding extra div <div class=”box-inner”>

<div class=”box”>  
   <div class=”box-inner”>  
     Testing for box model hack  
   </div>  
</div>

how to solve that box model problem without adding extra div and using Valid CSS.? can we solve this just by adding a doctype, or just only doctype will not solve this problem?

+2  A: 

No, you don't have to use XHTML or HTML 5, HTML 4 works just fine for getting into standards compliant mode.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"&gt;
Guffa
so just using this html 4 doctype will get same size for box in IE?
metal-gear-solid
Don't we need to add extra div ?
metal-gear-solid
@metal-gear-solid: Yes, in standards compliant mode IE doesn't use the incorrect box model, so you don't need the extra div.
Guffa
For other doctypes you could use to put IE 6 in standards mode, see http://hsivonen.iki.fi/doctype/#choosing
Paul D. Waite