Go Premium for a chance to win a PS4. Enter to Win

x
?
Solved

Targeting IE7 via an embedded style block

Posted on 2008-06-20
6
Medium Priority
?
240 Views
Last Modified: 2013-12-08
Here's the situation:
I've just been handed a Javascript file which writes a bunch of html to the document via document.write(); . I need to change around this html considerably, and it has to work in *at least* FireFox, Safari, and IE7. I have no access to any file other than this one Javascript file.

As I see it, there are two ways I can include css:
1) Inline via the "style='....'" attribute
2) I can have the Javascript function spit out a <style type='text/css'>...</> block before I have it write my html.

But how do I target IE7 in this situation? I've only really dealt with fixing IE6 bugs, which I did via a Holly Hack. Obviously that won't work with IE7.

Thanks.
0
Comment
Question by:Melvinivitch
  • 3
  • 3
6 Comments
 
LVL 82

Expert Comment

by:hielo
ID: 21835978
<!--[if IE 7]>
Special instructions for IE 7 here
<![endif]-->

via method #2: document.write("<!-- ... -->");

http://www.quirksmode.org/css/condcom.html
0
 

Author Comment

by:Melvinivitch
ID: 21837612
Conditional comments do not appear to work within a style block. But I found that the method outlined at the URL below seems to work. That is, using conditional comments to wrap all your html in a div that only IE sees, and then using descendant selectors in your css to generate IE-specific behavior. This makes the IE-targeting syntax in the style block nearly identical to a Holly Hack.

http://www.positioniseverything.net/articles/cc-plus.html
0
 

Author Comment

by:Melvinivitch
ID: 21837613
Can anyone verify that conditional comments do or do not work in a style block directly?
0
What does it mean to be "Always On"?

Is your cloud always on? With an Always On cloud you won't have to worry about downtime for maintenance or software application code updates, ensuring that your bottom line isn't affected.

 
LVL 82

Accepted Solution

by:
hielo earned 2000 total points
ID: 21838087
>>in a style block directly
Not "in" - "OUT". The conditional comment "Wraps" around your html tag (<link..>,<style...>, or whatever else):

<!--[if IE 7]>
<style type="text/css">
body{background-color:yellow;}
</style>
<![endif]-->
0
 

Author Comment

by:Melvinivitch
ID: 21838247
Ok, so I can just do a 2nd, IE-specific, style block after the main one, and re-define any classes I need to in order to target styling specifically to IE....right?
0
 
LVL 82

Expert Comment

by:hielo
ID: 21838286
Correct. The conditional comment need to be AFTER the "main" style block.
0

Featured Post

[Webinar] Cloud and Mobile-First Strategy

Maybe you’ve fully adopted the cloud since the beginning. Or maybe you started with on-prem resources but are pursuing a “cloud and mobile first” strategy. Getting to that end state has its challenges. Discover how to build out a 100% cloud and mobile IT strategy in this webinar.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Today, still in the boom of Apple, PC's and products, nearly 50% of the computer users use Windows as graphical operating systems. If you are among those users who love windows, but are grappling to keep the system's hard drive optimized, then you s…
Today, the web development industry is booming, and many people consider it to be their vocation. The question you may be asking yourself is – how do I become a web developer?
In this tutorial viewers will learn how to style transparent/translucent elements using alpha transparency in CSS Start with a normal styled element, such as a div.: Define its "background-color" property as "rgba (255, 255, 255, .5): The numbers in…
How to create a custom search shortcut to site-search Experts Exchange using Google in the Firefox browser. This eliminates the need to type out site:experts-exchange.com whenever you want to search the site. Launch your Bookmark Menu: Press 'Ctrl +…
Suggested Courses

782 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question