use*_*819 10 html css internet-explorer-7 zurb-foundation
已经提出了一种解决方案,使Zurb的Foundation 3 Framework与IE7一起工作.不一定是复杂的支持,但肯定是网格支持.
解决方案如下:http://www.stormconsultancy.co.uk/blog/development/code-snippets/making-zurb-foundation-3-work-on-ie7/
我试图在这里复制这个:http://sausag.es/foundation/grid.html
我在foundation.min.css中添加了一个指向htc文件的链接
引用是相对于HTML而不是CSS.
我在htaccess中添加了一行关于htc文件的内容.
但我仍然不能像在IE8中那样在IE7中显示网格.我哪里错了？
样式表中的以下行:
*behavior: url(/stylesheets/box-sizing.htc);
转换为以下地址:
http://sausag.es/stylesheets/box-sizing.htc
返回404.您可以通过将行更改为:
*behavior: url(/foundation/stylesheets/box-sizing.htc);
或者将box-sizing.htc文件向下移动一个文件夹.
另一种解决方案是使用条件注释检测ie7,然后为这样的列应用css修复:
.ie7 .columns{
margin-right: -15px ;
margin-left: -15px ;
display:-moz-inline-stack;
display:inline-block;
zoom:1;
*display:inline;
}
这将清除列上的填充并修复网格.您可以在其他div或部分布局上执行相同操作.
另外,您需要修复居中列和偏移列,如下所示:
.ie7 .row{
clear: both;
text-align: center;
}
.ie7 .offset-by-three {
margin-left:25% !important;
}
.ie7 .offset-by-seven {
margin-left:58.33% !important ;
}
当然有条件的评论:
<!-- paulirish.com/2008/conditional-stylesheets-vs-css-hacks-answer-neither/ -->
<!--[if IE 7]> <html class="ie7 oldie" lang="en"> <![endif]-->
<!--[if IE 8]> <html class="no-js lt-ie9" lang="en"> <![endif]-->
<!--[if gt IE 8]><!--> <html class="no-js" lang="en"> <!--<![endif]-->