Hello friends I am on the steps of coding my site I have done the header part but the problem arised when I saw my site in Firefox the problem is when I make the corrections for firefox it gets worse in IE so I have decided to used different stylesheets for IE I am using <!--[if lte IE 7]> <link rel="stylesheet" type="text/css" href="style2.css" /> <![endif]--> but not finding for firefox wud be thankful if someone cud tell the right code for firefox and if any other advise is also welcome
First, browser sniffing and delivering separate stylesheets for different browsers is a particularly Bad Idea. So what's the Good Idea? You use a complete DTD, so IE runs in standards mode rather than emulating IE5. Then, you write well structured, semantic and well formed html pages. Couple that with css that uses the properties properly. Use a modern browser as your prime test bed. IE is not a modern browser. If you write against a buggy IE, you will write buggy code. If you write against a good browser, say Opera or Firefox, what you see is what you wrote. It is trivial to apply IE work-arounds to good code. It is a royal PITA to make IE based code work for the good browsers. cheers, gary
I would disagree. I test all my sites in IE6, IE7 and Firefox. To not program for IE6 or IE7 is not smart. The primary reason is many people still use these browsers. Instead of separate browsers you can do overrides in your current CSS file to be recognized by these browsers. Although it is not optimal, it is one way of getting around that issue and still accommodating everyone.
How many stylesheets do you plan to write? One each for IE6, IE7 and another for modern browsers? What about IE8, which is promised to be fully compliant? When you make some change, are you looking forward to finding and modifying each and every version? I explained the proper way to do things, and I'll expand on that below. I realize you're new to this, but whoever gave you that suggestion was/is clueless. Please read more carefully. I did not suggest you not test in IE. I said don't use it as your primary test bed. You must use a good browser as the primary so you will know that your code is correct. A modern browser will display what you wrote as it is. IE is too buggy to depend on. Witness the number of people wondering why their background doesn't extend as expected in Firefox, when it does in IE, but they haven't contained their float elements properly and a bug in IE wrongly encloses the floats. IE6&7 have this bug, but IE8 won't (we hope). IE7 will work with the correct method, but IE6 won't. If you coded right to begin with, a work-around for IE6 is simple, but you wouldn't have any clue what caused the problem if you code against IE. Again, I didn't say don't test IE, I said to base your code on a modern browser. That gives you a solid coding foundation that IE cannot guarantee. gary
@letpcuser , actually he didnt meant so .He just said to test it in Firefox or opera @kk5st yea i am knew to browser sniffing actually I am doing 2 stylesheets 1for IE 7 and below and other for firefox and IE 8 wht do u say ?
There's another reason not to have more than a single stylesheet-- every single file referenced in your page needs to be loaded by the visitor. One stylesheet loads faster than two. Second, as Gary already said, you've just doubled the amount of work you're doing for a single site, AND every time you need to make a change, you need to do it twice AND IE6 and 7 in their version of "standards" mode isn't really that hard to work with... well, it is when you're new, but I'll tell you, at least after you've learned CSS pretty well, it IS fairly easy to accommodate the retards of Browserland. It can be done, I just want you to know. Mostly, 95% or more of your CSS should work for everyone. Then there are a few small but important things you pretty much need to hack for with regards to IE6 and sometimes 7. Fortunately, a lot of things can just go in the CSS like normal-- it either doesn't affect the modern browsers, or they just ignore it. An example is the double-margin float bug in IE6-- adding "display: inline;" to the floated thing is completely safe, ignored by all other browsers, yet magically eliminating the bug from IE6-- so you don't actually need a "hack" for that. Other major things are triggering Haslayout (which often you can do without a hack as well) and workarounds for display: table which IE (even 7) doesn't understand. There's also the PNG-with-alpha-transparency issue with IE6-- my solution is ALWAYS to use the IE6-and-under only hack to send a gif or something to IE6 users instead: element { background: url(someawesometransparency.png) 0 0 no-repeat; } * html element { background: url(somesuckytransparency.gif) 0 0 no-repeat; } Works like a charm-- see http://stommepoes.nl/P3rl/p3rl.html look at the search function in the header. IE6 actually doesn't even get an image-- and if I was smarter, I would have simply made a single image with both the camel and the fake semi-transparency-- oh wait, I didn't because the form can move around. Nevermind. : ) So, a few * html's here and there, and I can keep my single stylesheet. Only need to go to one place to make changes. The user only needs to load and cache a single CSS file. The page still looks reasonable in IE5.5, and pretty well in IE6 and 7. Everyone wins. The only way you're going to be able to do this, though, is to practise practise practise your CSS. You need to already be aware of the various bugs before you write it, and know different ways of getting the same result, so you have the flexibility to choose the option that gives you the fewest hacks. Hacks in general are useful, but should be minimised as much as possible. I regard a separate stylesheet as an unwanted hack, actually. Remember what Gary said about the proper Doctype-- this means, no ENTERs, SPACEBARS, nothing before the doctype, or IE ignores it and acts like IE5.5-- which IS difficult to style for on a single sheet. IE6 and 7 are nowhere near as bad. Some HTML templates add spaces before the doctype-- remove that space! Others, writing in XHTML, add that silly <?xml prologue thingie?> on the first line-- get rid of it. It's not real XML anyway, so you don't need it. Line 1, character1 must be the beginning of the doctype. I think this is the single most common source of pages having an IE stylesheet-- they threw IE into quirks mode and then couldn't get it to behave no matter what they did.
Just a suggestion, but maybe you should separate IE6 styles from IE7 because IE6 and IE7 don't render pages exactly the same. So do one for IE 6 and below, and another for firefox and IE7 and above. I'm not too familiar with the changes in IE8 yet, so if you feel that you need a separate stylesheet for that as well, then go for it.
Really, really, really a bad idea-- although you're right that IF you are going to stoop to an IE stylesheet, one for IE6 makes more sense than one for "IE"-- 6 and 7 are quite different indeed.
@stomme poes thx for the idea I am quite good in CSS but I dont have much experience abt creating them for different browsers I tried coding in 1 stylesheet but it created problems as the work is quite different so I will be going for 3 stylesheets also I found that many big sites use various sheets for their sites
I say this quite honestly, the Big Sites, who usually often have sh*tty invalid code, need multiple stylesheets because they don't know their CSS good enough, or just don't care and take what they think is the easy way out. Seriously, if a moron like me can manage a single stylesheet on 30-page sites with generated garbage--err, content on them, then these highly-paid "developers" for huge mega corporations who've graduated from some high-end technical school after 8 years sure as hell can do it. That they choose not to isn't ever a reason not to make your own code better. Be better than google.com.
and you deal with dissapearing/misplaced floats from a lack of haslayout, the double margin bug, and major sections of CSS missing from IE's implementation HOW exactly? That said, Gary is quite right as WASTING conditionals on browser sniffing is usally made of /FAIL/ - particulary since IE7 shouldn't even NEED one.... (IE6, well, then you probably need it) though without an actual link to the offending code, we're all guessing in the dark here.... Though if you are having to send IE7 a different stylesheet, it is VERY likely you have fat bloated presentational markup using coding techniques that are a decade out of date.