IE6下margin无效
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title></title> <style type="text/css"> * { margin:0; padding:0; } .container { margin:20px; border:1px dotted black; background:#f2ffbf; } .box-model { width:100px; height:100px; margin:10px; background:#cf0; border:1px dotted black; } </style> </head> <body> <div class="container"> <div class="box-model">box-a</div> <div class="box-model">box-b</div> <div class="box-model">box-c</div> </div> </body> </html>
解决办法:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title></title> <style type="text/css"> * { margin:0; padding:0; } .container { margin:20px; border:1px dotted black; background:#f2ffbf; zoom:1; } .box-model { width:100px; height:100px; margin:10px; background:#cf0; border:1px dotted black; } </style> </head> <body> <div class="container"> <div class="box-model">box-a</div> <div class="box-model">box-b</div> <div class="box-model">box-c</div> </div> </body> </html>