21489 Posts in 5783 Topics by 2622 members
General Questions
SilverStripe Forums » General Questions » Cascading Style Sheets for IE8 including within <Header> ?
General questions about getting started with SilverStripe that don't fit in any of the categories above.
Moderators: martimiz, Howard, Sean, Ryan M., biapar, Willr, Ingo, swaiba, simon_w
|
Page:
1
|
Go to End | |
| Author | Topic: | 1525 Views |
-
Cascading Style Sheets for IE8 including within <Header> ?
30 August 2010 at 3:01pm Last edited: 30 August 2010 3:14pm
Does anyone know how I can add in conditional CSS for IE8 for SilverStripe.
I've already looked into http://doc.silverstripe.org/css & http://msdn.microsoft.com/en-us/library/ms537512%28VS.85%29.aspx
I have already tested to see whether <!--[if IE]><![endif]--> is functional within the current version of SilverStripe v2.4.1 on Internet Explorer 8.0 with this line of code within <body></body>
<!--[if IE]><p>You are using Internet Explorer.</p><![endif]-->
Which retrieves the output 'You are using Internet Explorer.' when viewed on that particular browser.
Some code which has already been attempted on 'Page.ss' within '<header></header>', the issue the code below has is that when viewed on Internet Explorer it outputs whatever is inside ie.css. And when I view it on Firefox it also outputs whatever is inside ie.css. Which means there is a conflict within the Conditional Comment.
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" >
<head>
<% base_tag %>
$MetaTags
<link rel="shortcut icon" href="/favicon.ico" />
<!--[if IE]><% require themedCSS(ie) %><![endif]-->
</head>I've also tried using ..
<!--[if IE]><link rel="stylesheet" type="text/css" href="$project/css/ie.css" /><![endif]-->
The problem is that the link rel cannot find the directory/path of the cascading style sheet for internet explorer, When I click 'View Source Code' in internet explorer the output is...
<!--[if IE]><link rel="stylesheet" type="text/css" href="mysite/css/ie.css" /><![endif]-->
And the difference between my conditional comment and the data within page.php is the other style sheets have the correct path but the $project/css/ie.css doesn't output the correct path.
<link rel="stylesheet" type="text/css" href="http://localhost/silverstripe/themes/storeyblue/css/form.css?m=1282270534" />
Thanks for your time! and sorry for the wall of text
-
Re: Cascading Style Sheets for IE8 including within <Header> ?
30 August 2010 at 4:07pm
Try the following in you Page_Controller init() function in Page.php
$theme = SSViewer::current_theme();
$css_path = "themes/$theme/css/";
Requirements::insertHeadTags("<!--[if IE 8]><style type='text/css'>@import url({$css_path}ie.css);</style><![endif]-->");Put it at the end of the function otherwise it may not cascade correctly. You can change $css_path to use $project if the file is in mysite (or equivalent project directory).
hth
Rich
-
Re: Cascading Style Sheets for IE8 including within <Header> ?
30 August 2010 at 6:14pm Last edited: 30 August 2010 6:22pm
Thanks alot! TotalNet, the code
Requirements::insertHeadTags("<!--[if IE]><style type='text/css'>@import url(themes/" . SSViewer::current_theme() . "/css/ie.css);</style><![endif]-->");
worked like a charm, now when I view my theme in IE it uses the ie.css and when I view my theme in Firefox it uses the layout.css
| 1525 Views | ||
|
Page:
1
|
Go to Top |
