很少工作，网格系统，盒子尺寸

我们知道IE7不支持盒大小：边界盒;这使我在IE7样式表中分别为每个元素指定宽度。

我想写一些逻辑在我grid.less，这样的宽度将相应的IE7计算..

就像下面

.grid{ 
    width:/*width for modern browsers */; 
    *width:/*calculate width for ie7 */; 
}

请帮助或点我的任何资源....谢谢

来源

2014-03-05 Naresh sadu

LESS没有一个函数允许你定位特定的浏览器。

这样做的标准方法是用单独的样式表：

<link rel="stylesheet" type="text/css" media="screen" href="css/grid.css" /> 
<!--[if IE 7]> 
    <link rel="stylesheet" type="text/css" media="screen" href="css/ie7-grid.css" /> 
< ![endif]-->

但是相反，你可以使用的方法类似下面from Paul Irish：

HTML ...

<!--[if lt IE 7]>  <html class="ie6"> <![endif]--> 
<!--[if IE 7]>   <html class="ie7"> <![endif]--> 
<!--[if IE 8]>   <html class="ie8"> <![endif]--> 
<!--[if gt IE 8]><!--> <html>   <!--<![endif]-->

LESS ...

.grid{ 
    width:/*width for modern browsers */; 
    .ie7 & { 
    width:/*calculate width for ie7 */; 
    } 
}

...这将导致CSS像...

.grid{ 
    width:/*width for modern browsers */; 
} 

.ie7 .grid{ 
    width:/*calculate width for ie7 */; 
}

来源

2014-03-05 06:26:40 Tims

是的，我同意你的观点蒂姆斯，但我的想法是做类似下面少。使柱（@columns）{ float：left; 宽度：百分比（@columns/@ grid-columns）; padding-left：@ grid-column-padding; padding-right：@ grid-column-padding; * width：〜“calc（percent（@columns/@ grid-columns） - （2 * @ {grid-column-padding}））”; .box-sizing（border-box）; } ...但我无法从百分比中减去像素.. –

很少工作，网格系统，盒子尺寸

回答

相关问题