[jQuery] Re: Body Browser Classes
On Apr 4, 10:48 pm, Glen Lipka [EMAIL PROTECTED] wrote:
Feedback desired:
!-- Old Internet Explorer -- Lately, I have been developing CSS
and HTML for a deep Web 2.0 complex app.
Usually, I avoid CSS hacks like the plague. But recently, I have had to
resort to the Holly Hack or the StarHTML Hack. But then it occured to me
that jQuery provides a better way.
A simple plugin could be written (has this already been written?) that tags
the BODY (or other node) with a browser class resulting in:
body class=FF or body class=IE6 or body class=Saf or whatever.
Then your CSS would be:
body.ie6 div.troublesome {height: 100%} rather than
* html div.troublesome etc
This makes your CSS avoid bizarre invalid hacks and use normal conditional
classes that are self-documenting. Everyone knows that body.IE6 means you
are adjusting for browser differences. And jQuery is much better at
detection than crazy hacks.
There is an easier way that is not jQuery-or-Javascript-dependent,
since mostly we just want to know is the browser IE or not. Use
conditional comments around the BODY tag. See
http://www.puidokas.com/updating-my-css-for-ie7/
. I use :
!-- Old Internet Explorer --
!--[if lt IE 7]
body class=IE IElt7
![endif]--
!-- New Internet Explorer --
!--[if gte IE 7]
body class=IE
![endif]--
!-- Any other browser --
!--[if !IE]--
body class=notIE
!--![endif]--
Danny Wachsstock
[jQuery] Re: Body Browser Classes
!--[if lt IE 7] link rel=stylesheet href=ie.css type=text/css ![endif]-- I think the alternative is for people who want to keep their classes together even if some of them are browser specific. For example, in the app I am working on the CSS is enormous. (dont ask) And the whole thing is changing pretty rapidly. And I am going to want to change certain things section-by-section. In this scenerio, I really do not want to seperate out an ie6.css. I just want to comment in my css /* override for blah blah because IE6 sucks */. The benefit of his method is that it doesn't use JS, which I thought was an interesting implementation and avoids the depends on JS issue. Glen
[jQuery] Re: Body Browser Classes
Hi.
I love this idea, it's inventive and the need is there.
The only feedback I have is that CSS that depends on JS will absolutely
not fly where I work and play.
Nathan
Feedback desired:
Lately, I have been developing CSS and HTML for a deep Web
2.0 complex app. Usually, I avoid CSS hacks like the plague.
But recently, I have had to resort to the Holly Hack or the
StarHTML Hack. But then it occured to me that jQuery
provides a better way.
A simple plugin could be written (has this already been
written?) that tags the BODY (or other node) with a browser
class resulting in:
body class=FF or body class=IE6 or body class=Saf
or whatever. Then your CSS would be:
body.ie6 div.troublesome {height: 100%} rather than
* html div.troublesome etc
This makes your CSS avoid bizarre invalid hacks and use
normal conditional classes that are self-documenting.
Everyone knows that body.IE6 means you are adjusting for
browser differences. And jQuery is much better at detection
than crazy hacks.
I wish all my CSS could do it right and find the common
ground that all the browsers love. But this seems like a better way.
What is your opinion?
Anyone want to write a plugin that allows for $(body).browserTag()?
Personally, I think this would be a cool thing in the
basecode, but I wont push it.
Glen
[jQuery] Re: Body Browser Classes
Glen Lipka schrieb: I hear everyone's points. I think the easy to remove it in 2012 argument doesn't resonate for me, since anything created today will be changed within 1-3 years (in my experience) and IE6 isn't going away that soon. The screen-reader/mobile stuff seems like they would have a different CSS base than the main browser audience anyway, so wouldn't applicable. The conditional comments are good, but need seperate CSS and limit the option NOT to do that. JS being required is a good point, but I guess it depends on how much tweaking versus wholesale changes are used. With our without hacks. I think, you overlooked the delivering smaller style sheets to modern browsers argument, which is to me more valid than the easy to remove one. Although I wonder, you were saying that hacks feel dirty, doesn't a style sheet messed up with hacks feel much more dirty than two separate style sheets, of which one is free from hacks? To avoid overlooking properties that are overruled in IE's bugsheet is just a matter of proper commenting your style sheets. Last not least I recommend to all using hacks to read 1. Molly about Long term hack strategies: http://www.informit.com/articles/article.asp?p=170511rl=1 2. Tantek - inventor of the CSS hack! - about hacks: http://tantek.com/log/2005/11.html -- Klaus
[jQuery] Re: Body Browser Classes
Good Articles. I found it interesting to think about that hacks should be ugly. I think your point about browser specific sheets is well taken. Firebug makes this a good thing when you see what styles are applied and can see which file they are in. I wish IE had similar. Another article I found interesting was how OpenLazlo deals with this: http://weblog.openlaszlo.org/archives/category/documentation/ Wouldn't it be cool if you could invlude a jQuery plugin that made all the browsers act the same for css? I know it would be dependant on JS, but it would make development of alot of projects much faster. Lots of projects I see don't let you in without JS. Glen On 4/5/07, Klaus Hartl [EMAIL PROTECTED] wrote: Last not least I recommend to all using hacks to read 1. Molly about Long term hack strategies: http://www.informit.com/articles/article.asp?p=170511rl=1 2. Tantek - inventor of the CSS hack! - about hacks: http://tantek.com/log/2005/11.html -- Klaus
