{var%20f='http://v.t.sina.com.cn/share/share.php?appkey=1515056452',u=z||d.location,p=['&url=',e(u),'&title=',e(t||d.title),'&source=',e(r),'&sourceUrl=',e(l),'&content=',c||'gb2312','&pic=',e(p||'')].join('');function%20a(){if(!window.open([f,p].join(''),'mb',['toolbar=0,status=0,resizable=1,width=440,height=430,left=',(s.width-440)/2,',top=',(s.height-430)/2].join('')))u.href=[f,p].join('');};if(/Firefox/.test(navigator.userAgent))setTimeout(a,0);else%20a();})(screen,document,encodeURIComponent,'','','https://www.manongdao.com/data/attach/logo/logo.png', '推荐 Root（大扎） 的问题《Rails 4 x SASS: load specific stylesheet in Intern》','https://www.manongdao.com/q-1118814.html','页面编码gb2312|utf-8默认gb2312'));){kind=link}
In my Rails 4 app, I am trying to implement a conditional to load different stylesheets for Internet Explorer VS. other browsers.
I have an app/views/layout/_header.html.erb partial with:
<head>
<%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track' => true %>
<!--[if !IE]><!-->
<%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track' => true %>
<%= stylesheet_link_tag 'ie', media: 'all', 'data-turbolinks-track' => true %>
<!--<![endif]-->
<%= javascript_include_tag 'application', 'data-turbolinks-track' => true %>
<%= csrf_meta_tags %>
</head>
And I have the following stylesheets in app/assets/stylesheets:
custom / # with all my model-specific stylesheets here, such as posts.scss
application.scss
custom.scss
ie.scss
In application.scss I have:
@import "bootstrap-sprockets";
@import "bootstrap";
@import "bootstrap/theme";
@import "bootstrap-datetimepicker";
@import "font-awesome-sprockets";
@import "font-awesome";
@import "simple_calendar";
@import "custom.scss";
@import "custom/**/*";
Note: the IE-specific rules in ie.scss are very light, less than 20 lines of code.
However, when I launch the app in Internet Explorer, the CSS rules from ie.scss are not taken into account.
How can I make the ie.scss file load when the user launches the app in Internet Explorer?
For all IE versions:
And instead of specifying ie.css, you can change it to:
So that you don't have to add each and every file separately. What I generally use in my projects: