兼容性-inline-block
阿新 • • 發佈：2017-05-12
col round 解決 play tle doctype idt 技術分享 其他
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <style> div{ width: 100px; height: 100px; display: inline-block; background: red; } </style></head> <body> <div>div1</div> <div>div2</div> <div>div3</div> </body> </html>
其他瀏覽器正常顯示一行，IE6/7顯示效果如下（不認display：inline-block）
可以通過下面方法解決
*display: inline;
*zoom: 1;
div{ width: 100px; height: 100px; display: inline-block; background: red; *display: inline; *zoom: 1; }
問題2：當設置高度為1px的時候，IE6顯示高度為19px，可以通過overflow：hidden解決
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <style> div{ height: 1px; background: red; } </style></head> <body> <div>div1</div> </body> </html>
兼容性-inline-block