explorer css hacks with

April 1, 2010 by alfonso

If you need IE conditional css loading, you can append a condition to your css file in your view.yml:

default:  
    
  http_metas:  
    content-type: text/html  
  
  stylesheets:  
    - styles  
    - reset  
    - main  
    - markdown  
    - ie6: {condition: IE 6}  
    - ie7: {condition: IE 7}  
    - ie8: {condition: IE 8}  
    - ie:  {condition: IE}  
  
  javascripts:  
    - front  
  
  has_layout:     true  
  layout:         layout

with these lines in yout view.yml, you get your condicional statements in your <head> section:

<!--[if IE 6]><link rel="stylesheet" type="text/css" media="all" href="/themeHomeplace/css/ie6.css" /><![endif]-->  
  
<!--[if IE 7]><link rel="stylesheet" type="text/css" media="all" href="/themeHomeplace/css/ie7.css" /><![endif]-->  
  
<!--[if IE 8]><link rel="stylesheet" type="text/css" media="all" href="/themeHomeplace/css/ie8.css" /><![endif]-->

Add a comment

Comments

GabeOctober 26, 2010 12:18 AM

This is not working! Regen code, symfony cc, but not getting the conditionals.
GabeOctober 26, 2010 7:30 AM

I think it's a bug with DMStyleSheetCompressor

92 Warning dmStylesheetCompressor Missing css : sf_root_dir/web/theme/css/ie6.css { condition: IE 6 }.css
93 Warning dmStylesheetCompressor Missing css : sf_root_dir/web/theme/css/ie7.css { condition: IE 7 }.css
94 Warning dmStylesheetCompressor Missing css : sf_root_dir/web/theme/css/ie8.css { condition: IE 8 }.css
95 Warning dmStylesheetCompressor Missing css : sf_root_dir/web/theme/css/ie.css { condition: IE }.css