What are the most effective means to implement cross browser css?

What are the most effective means to implement cross browser css?

Regulation : one strategy for a solution.

2019-05-07 12:33:32
Source Share
Answers: 6

When I read inquiries and also solutions similar to this I start to assume I could be insane, yet I have actually created rather intricate internet sites making use of a fair bit of css, consisting of css3 and also various other trickiness, and also I have actually never ever needed to resort also to conditional remarks.

I do nonetheless frequently examine my job accross numerous internet browsers (I code mostly in Chrome, and also examination in firefox and also ie7) throughout coding. When I see concerns show up, I simply take a go back, identify why points are providing in different ways, and also usually pick a somewhat various strategy.

That being claimed, I do have an intellectual passion it these various hacks and also approaches. I specifically like reviewing strategies made use of by CSS3 PIE and also modernizr.

The most effective means to strategy cross - internet browser coding is to be knowledgeable about the differnt means various internet browsers will certainly analyze your code, and also write it in such a way that they can not aid yet get it right.

2019-05-30 15:23:10

You can make use of conditional comments to deal with concerns with Internet Explorer. In addition to that, you should not ever before require to target Firefox/Chrome/Opera independently from each various other, they all sustain the criteria.

Caching should not become part of it ; you need to be offering the very same code for all internet browsers.

2019-05-09 07:05:59

CSS3 PIE looks rather encouraging as a CSS3 compatibility layer. Certainly, there are various other cross - internet browser problems for previous CSS variations.

Relevant inquiry pertaining to IE6, great deals of valuable details : Should I bother supporting IE6?

2019-05-09 07:04:05

The ideal, most convenient means is to make use of a collection. Collections like OOCSS, Blueprint, or 960gs are currently crafted to reproduce their display screen throughout the significant internet browsers. All you're entrusted afterwards, a lot of the moment, is your production certain your personalized designs are cross-browser certified which your markup does not generate any kind of troubles.

Stay clear of hacks like the torment if in all feasible (yes, make use of conditionals).

2019-05-08 02:41:25

Prefacing this with a caution versus making use of CSS hacks.

From a pure efficiency point ofview, caching will certainly be extra reliable with a file if for nothing else factor than it reacts as soon as to a solitary HTTP demand from the customer. Along with offering the very same documents to every customer no matter internet browser, Conditional comments block downloads in some scenarios.

To target all your various Internet Explorer variations in a file there are numerous CSS hacks. Remember that these will certainly provide your CSS void (if recognition is a problem for you).

body {  
    color: red;         /* all browsers */  
    color : green\9;    /* IE8 and below */  
    *color : yellow;    /* IE7 and below */  
    _color : orange;    /* IE6 */  

The conditional remarks obstructing is actually just a concern in some instances in IE8 when there is a conditional comment. Relying on what you think of sustaining Internet Explorer, this might or might not be a concern.

I directly make use of conditional remarks. I directly think that CSS hacks are horrible, which any kind of efficiency struck that originates from conditional remarks be it actual or visualized is unworthy the problem that CSS hacks usually create.

Conditional remarks are reasonably very easy to implement, and also there's a great article concerning their usage on Quirksmode. The adhering to will certainly resolve just IE6 :

<!--[if IE 6]>
    <link rel="stylesheet" type="text/css" href="/media/css/ie6.css" />

There is syntax that will certainly permit you to target Internet Explorer of variation equivalent to, much less than, more than, much less than or equivalent to, more than or equivalent to an offered variation number. The instance over is just one of equivalent to.

2019-05-08 02:31:24

What I do is make use of a reset CSS and afterwards conditional declarations. The reset CSS solutions mostly all of the troubles and also the conditional solution any kind of troubles in IE. If there are distinctions in between the various other internet browsers, I generally attempt to function around them, such as raising the size for all internet browsers or a typeface dimension.

I directly make use of the YUI reset CSS.

2019-05-08 02:29:48