July 4, 200818 yr hi guys. How can i make a style sheet that is strictly for a specific browser, like IE. I want to make some different styles that overwrite the default styles in the main style sheet. My problem is of course with IE6-7. The site on the whole views correctly but the bullet points and margins are all screwy. Please advise. Thanks! -Seth
July 4, 200818 yr Author I have a solution! I got this from kristensguide.com IE and Mozilla handle CSS instructions differently. It's annoying! But, there is a way to get around it. Make multiple style sheets, one for each type of browser. Then customize each style sheet for it's corresponding browser. Create two style sheets, one for IE browsers (IE-stylesheet.css) and one for every other kind of browser (default-stylesheet.css). Tell Internet Explorer to use a separate style sheet by inserting the following code between your header tags <head></head>. Change the name and path of the css files to that of the css files on your site. The code must appear in this order. <!--[if IE]> <link rel="stylesheet" type="text/css" href="IE-stylesheet.css" /> <![endif]--> <![if !IE]> <link rel="stylesheet" type="text/css" href="default-stylesheet.css" /> <![endif]> This method does not rely on javascript, so it will work even if javascript is disabled. The <![if IE]>, <![if !IE]>, and <![endif]> tags are only recognized by Internet Explorer.
July 5, 200818 yr Thanks Dizi yea found it took me a while. But i got it Hi WOW! brilliant solution (haven't tried it yet), but i've been struggling with firefox and IE for days to try to get them the same. It has been very frustrating. I'll report back when i've tried to implement the solution. best regards luigie
July 5, 200818 yr Rather than use 2 lots of conditional comments like this: <!--[if IE]> <link rel="stylesheet" type="text/css" href="IE-stylesheet.css" /> <![endif]--> <![if !IE]> <link rel="stylesheet" type="text/css" href="default-stylesheet.css" /> <![endif]> I would have my default stylesheet first in the source code and the conditional comment after targetting the problem areas. <link rel="stylesheet" type="text/css" href="default.css" /> <!--[if IE]> <link rel="stylesheet" type="text/css" href="IE-stylesheet.css" /> <![endif]--> Don't forget that you can also target specific versions of IE. For example <!--[if lte IE 6]> <link rel="stylesheet" type="text/css" href="IE6andbelow.css" /> <![endif]--> would target IE6 and below (IE5.5, IE 5)
July 6, 200818 yr HiWOW! brilliant solution (haven't tried it yet), but i've been struggling with firefox and IE for days to try to get them the same. It has been very frustrating. I'll report back when i've tried to implement the solution. best regards luigie Hi Guess what Guys & Dolls? it works! yay :drinks: Best regards luigie
July 15, 200818 yr I have a solution! I got this from kristensguide.com Hi Goldstein Media I used your solution and it works very well I now have a problem with validation, it says I have 5 errors on my web page and these are: Validation Output: 5 Errors 1. Error Line 17, Column 3: "if" is not a reserved name. <![if !IE]> ✉ 2. Error Line 17, Column 6: character data is not allowed here. <![if !IE]> ✉ You have used character data somewhere it is not permitted to appear. Mistakes that can cause this error include: * putting text directly in the body of the document without wrapping it in a container element (such as a <p>aragraph</p>), or * forgetting to quote an attribute value (where characters such as "%" and "/" are common, but cannot appear without surrounding quotes), or * using XHTML-style self-closing tags (such as <meta ... />) in HTML 4.01 or earlier. To fix, remove the extra slash ('/') character. For more information about the reasons for this, see Empty elements in SGML, HTML, XML, and XHTML. 3. Error Line 19, Column 4: "endif" is not a reserved name. <![endif]> ✉ 4. Error Line 17, Column 1: XML Parsing Error: StartTag: invalid element name. <![if !IE]> ✉ 5. Error Line 19, Column 2: XML Parsing Error: StartTag: invalid element name. <![endif]> Does anyone have a solution? Best regards luigie
Create an account or sign in to comment