Skip to main content

This site requires you to update your browser. Your browsing experience maybe affected by not having the most up to date version.

General Questions

General questions about getting started with SilverStripe that don't fit in any of the categories above.

Moderators: martimiz, Sean, biapar, Willr, Ingo, swaiba, simon_w

editor css just for ie


Reply

3 Posts   972 Views

Avatar
JMagnusson

2 July 2011 at 2:46am Community Member, 29 Posts

Hello.
In IE the paragraphs behave like movable boxes. Sometimes I get empty paragraphs which are hard to find and delete. I want to highlight every paragraph with p{border-left:3px solid #eee;}, but just in IE.

There may be some fixes, like to use IE’s CSS-BE support (/* any IE */ border: expression('...');), but I want to do it the "good" way.

Can I decorate leftandmain.php with an ie-only condition? How?

Thanks, Johan

Avatar
Invader_Zim

2 July 2011 at 4:08am (Last edited: 2 July 2011 4:10am), Community Member, 141 Posts

Hi.

It's just a theory and I can't test it right now, since I'm in front of my Ubuntu machine...

But you could create a css file in /mysite/css named editor-ie.css and write your IE specific styles there.
After that you could copy /cms/templates/LeftAndMain.ss to your /mysite/templates directory.
There you edit it and put a conditional comment before the closing </head> section like this:

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

This should override the styles from editor.css with your IE styles... (well, in my theory at last ;-) )

Cheers
Christian

Avatar
JMagnusson

2 July 2011 at 5:27am Community Member, 29 Posts

Thanks, that worked. Of course there were a .ss file somewhere too.

If someone has the same need, I can tell there are two ways to solve it:

The "ugly" one, but it works:
In your editor.css

p {
   border-left: expression('3px solid #eee');
   }

The good one like the previous post:


  • Copy LeftAndMain.ss to mysite/templates
    Insert in the headsection: <!--[if IE]> <link rel="stylesheet" type="text/css" href="$ThemeDir/css/editor-ie.css" /> <![endif]-->
    Write an editor-ie.css file and place it in $ThemeDir/css/editor-ie.css or where you want to have it.