CODEWITHSUNDEEP
phpcssinternet-explorercakephp
Richard Luckhurst
Richard Luckhurst

Reputation: 111

CakePHP 2 IE Conditional CSS in default.ctp

I am developing an application using CakePHP 2 and have come up against an issue in the default.ctp template file. I have had a hunt around the web and am unable to find an answer that works for me. I can't find a way to have a conditional CSS file included for IE.

I am doing the following for my normal CSS

echo $this->Html->css(array('screen', 'print'));

echo $this->fetch('css');

And this works fine and produces the following html.

<link rel="stylesheet" type="text/css" href="/css/screen.css" />
<link rel="stylesheet" type="text/css" href="/css/print.css" />

What I need to be able to add to the above CSS is the following conditional include

<!--[if IE]> <link rel="stylesheet" type="/text/css" href="/css/ie.css" /> <![endif]-->

I can not see how to include the ie.css into the array of css files before the fetch.

I would appreciate any help in solving this issue.

Regards

rickl

Upvotes: 0

Views: 299

Answers (2)

Simon
Simon

Reputation: 4814

You can use Conditional CSS Includes:

Add the following to your Layout:

<?php if ($ieCond = $this->fetch('ie')): ?>
<!--[if IE]><?php echo $ieCond; ?><![endif]-->
<?php endif; ?>

Add the following to your View:

<?php $this->Html->css('ie', array('block' => 'ie')); ?>

Source: CakePHP Api

Tested in IE11 and FF → Works for me.

Upvotes: 1

Rajeev Ranjan
Rajeev Ranjan

Reputation: 4142

Just add css between IE conditional block i.e 

<!--[if IE]>
<?php $this->Html->css(array('ie'); ?>
<![endif]-->

Upvotes: 2

Related Questions