Beta
×

Welcome to the Slashdot Beta site -- learn more here. Use the link in the footer or click here to return to the Classic version of Slashdot.

Thank you!

Before you choose to head back to the Classic look of the site, we'd appreciate it if you share your thoughts on the Beta; your feedback is what drives our ongoing development.

Beta is different and we value you taking the time to try it out. Please take a look at the changes we've made in Beta and  learn more about it. Thanks for reading, and for making the site better!

CSS Selectors as Superpowers

samzenpus posted about a year ago | from the talking-style dept.

Programming 190

An anonymous reader writes "Simon St. Laurent writes in praise of CSS selectors: 'After years of complaints about Cascading Style Sheets, many stemming from their deliberately declarative nature, it's time to recognize their power. For developers coming from imperative programming styles, it might seem hard to lose the ability to specify more complex logical flow. That loss, though, is discipline leading toward the ability to create vastly more flexible systems, a first step toward the pattern matching model common to functional programming.'"

cancel ×

190 comments

Sorry! There are no comments related to the filter you selected.

Completely agree (5, Informative)

Chrisq (894406) | about a year ago | (#43607595)

Anyone who has used JQuery will know how their power exceeds the original intention

Re:Completely agree (4, Insightful)

itsdapead (734413) | about a year ago | (#43607735)

Anyone who has used JQuery will know how their power exceeds the original intention

...anybody who has used jQuery will know how powerful they could have been if only browsers had implemented them completely and consistently.

Meanwhile, anybody who has used CSS will wonder what the hell the original intention was, given the arcane kludges needed to produce popular web-page layout effects easily achieved using evil tables and frames, the lack of 'constants' to set standard colours and measurements.You know there's something wrong with a standard when Microsoft's broken box-model implementation makes more sense. However, that's not the fault of the selectors.

Its as if the designers* of CSS had never looked at a web site, used a DTP package, used styles in a WP package, let alone played with a Java layout manager to get ideas about what might work and/or be useful.

(* probably unfair - I'm sure it was a mixture of committee syndrome and the notion that you can define a standard without producing a reference implementation rather than individual failings).

Re:Completely agree (1, Interesting)

Anonymous Coward | about a year ago | (#43607755)

Many of the problems of CSS are fixed if you use something like SASS or LESS that let you use mixins. They make it easy to define variables and even functions for things like common colours, borders and margins, effects and stuff like that. They also serve as a nice insulation layer between grid frameworks (which are very useful, but encourage presentation in your HTML, e.g. class='four columns') and the nice semantic CSS/HTML you know you should be writing. Hopefully at some point in the future they'll be part of the standard.

Re:Completely agree (4, Insightful)

dingen (958134) | about a year ago | (#43607777)

Things like SASS and LESS point out where the big flaws of CSS are. It's crazy we still don't have variables in 2013 by default, this has been at the top of the requested features list for what, 15 years now?

Re:Completely agree (-1)

Anonymous Coward | about a year ago | (#43607809)

Screwdrivers and measuring tape point out where the big flaws of hammers are.

Re:Completely agree (1)

dingen (958134) | about a year ago | (#43607845)

That makes no sense. CSS could easily be fixed by a lot of the things that are already in SASS and LESS. They are not different tools for a different job.

Re:Completely agree (3, Interesting)

WizardFusion (989563) | about a year ago | (#43607835)

I use a PHP file as my CSS. Take a look... http://www.barelyfitz.com/projects/csscolor/ [barelyfitz.com] or http://css-tricks.com/css-variables-with-php/ [css-tricks.com]

Re:Completely agree (4, Interesting)

Bazman (4849) | about a year ago | (#43608167)

And now your web server has to do PHP processing on every page and every style sheet, so your load goes up. So you implement some caching. Now you have two problems.

Re:Completely agree (1)

CastrTroy (595695) | about a year ago | (#43608289)

Yeah, better to just have a PHP script which generates a CSS file and run the script whenever changes are made and you need to refresh the style sheet.

Re:Completely agree (1)

dingen (958134) | about a year ago | (#43608489)

Yeah, I suppose you could do that. Or you could just use LESS or SASS, which basically do the same thing and give you a whole lot more.

Re:Completely agree (3, Funny)

mortonda (5175) | about a year ago | (#43608313)

And now your web server has to do PHP processing on every page and every style sheet, so your load goes up. So you implement some caching. Now you have two problems.

3 problems.... php itself being one.

Re:Completely agree (2)

jonr (1130) | about a year ago | (#43608385)

He's using PHP? I get the pitchforks!

Re:Completely agree (5, Insightful)

RevDisk (740008) | about a year ago | (#43608565)

I always liked PHP, but I'm an infrastructure guy who only uses PHP for relatively minor stuff. Something doesn't need to be perfect to be useful.

Please don't burn me, I don't weigh the same as a duck...

Re:Completely agree (0)

Anonymous Coward | about a year ago | (#43608933)

Now you have two solved problems.

FTFY.

Re:Completely agree (1)

mwvdlee (775178) | about a year ago | (#43608195)

I swear by LESS, but it isn't a standard and requires too much CPU (whether processed server side or client side), and it doesn't fix a model which makes it very difficult to do very common layouts.

Re:Completely agree (2)

dingen (958134) | about a year ago | (#43607763)

...anybody who has used jQuery will know how powerful they could have been if only browsers had implemented them completely and consistently.

This used to be true a few years ago, but all modern browsers nowadays parse selectors quite similar. Even IE8 is not so bad (it understands CSS 2.1 selectors like :first-child and [attribute] etc.).

Of course things keep evolving all the time, so if you want to use cutting edge stuff, you might run into some things. But in general I think especially the selectors are amongst CSS' least problematic areas.

Re:Completely agree (1)

CastrTroy (595695) | about a year ago | (#43608311)

Even IE8 (If you use the proper DOCTYPE to bring it out of legacy mode) is not so bad (it understands CSS 2.1 selectors like :first-child and [attribute] etc.).

Fixed that for you. This has to be the most annoying part of it all. They really should have implemented the opposite where you required a special doctype to put the browser into legacy mode. Would have made everybody start to make their pages standards compliant much sooner.

Re:Completely agree (2)

dingen (958134) | about a year ago | (#43608347)

On the other hand, this really forced devs to include the proper doctypes in their work, which is a good thing!

Re:Completely agree (0, Troll)

WillKemp (1338605) | about a year ago | (#43607781)

[......] given the arcane kludges needed to produce popular web-page layout effects easily achieved using evil tables and frames, the lack of 'constants' to set standard colours and measurements.

Bad craftspeople have a definite tendency to blame their tools. If people put the same amount of energy into learning how to use CSS properly that they put into whining about something they clearly don't understand, the web would be a much better place.

Re:Completely agree (3, Insightful)

chris.alex.thomas (1718644) | about a year ago | (#43607921)

not true, there are clear defects in the tools that almost everybody agrees on (variables), plus the browsers don't support everything even though the specs are years old.

sometimes the tools really are bad....

Re:Completely agree (5, Funny)

Lumpy (12016) | about a year ago | (#43608105)

Tell that to the guy that has to build a house with a saw that has no teeth.

He will probably beat you to death with that saw. People that have no clue at all as to the problems with the tools or even how to do the task are the first to blame the craftsman.

Re:Completely agree (0)

Anonymous Coward | about a year ago | (#43608393)

Tell that to the guy that has to build a house with a saw that has no teeth.

But he obviously wasn't a skilled craftsman if he didn't know how to sharpen his saw [vintagesaws.com] ....

Re:Completely agree (1)

itsdapead (734413) | about a year ago | (#43608563)

Bad craftspeople have a definite tendency to blame their tools

...and bad software designers have an even more definite tendency to blame their users. Usability/clarity and appropriateness for the intended user base (in this case, graphic designers) is part of good tool design.

CSS smacks of being a hammer designed by someone who has never seen a nail.

Re:Completely agree (2)

Yvanhoe (564877) | about a year ago | (#43607825)

Meanwhile, anybody who has used CSS will wonder what the hell the original intention was

It was to provide an easier alternative to xhtml/xsl. Instead of the total separation between data and formatting that many programmers rooted for, it is a bastard compromise that was reached : HTML would still specify both data and formatting but formatting would "skinable".

Some days I think that we live anyway in a world of compromise and that it is true that HTML/CSS is easier to use in 95% of case, yet other days I wonder if in the end we are not doomed to come back to the original intent, after a long path : have a Turing-complete language generate the formatted page from an XML content.

Re:Completely agree (1)

M. Baranczak (726671) | about a year ago | (#43608157)

generate the formatted page from an XML content

Some web programming frameworks already work like that.

Re:Completely agree (4, Interesting)

BasilBrush (643681) | about a year ago | (#43607871)

What box model would be best?

Serious question. I'm doing a specialist graphics app at the moment, and I was just considering this the other day. What's the important rect for a box?

Most graphics app use a rect that is halfway through the border by default, as a result of the concept of "stroking" the rect. CSS is very different, and as you say a bit broken, by default using outside the margin for position, and content rect for size. So there's no concrete rect for layout of a box at all in CSS. And then there's box-sizing, which could allow the concept using the same rect for positioning and size, but doesn't.

How would a designer prefer to think of the primary metrics of a box, for the sake of alignment, snap to grid, proportional resizing etc?
1) Margin rect
2) Outside border
3) Centre of border
4) Inside border (outside padding)
5) Around the content (inside padding).

Of course, "all of them" and "it depends" are rational answers. But not much use when deciding on default or standard behaviour.

Re:Completely agree (1)

Anonymous Coward | about a year ago | (#43608017)

I had this conversation yesterday with someone who is convinced that IE6's take on width and padding is correct. I can't say it isn't.

Agreement is the crucial point. Good luck with your app!

Re:Completely agree (2)

AvitarX (172628) | about a year ago | (#43608185)

I always thought it should be the border, with padding pushing the content in, and margin pushing other content away.

it would make % sizes work more intuitively I think.

Re:Completely agree (2)

StripedCow (776465) | about a year ago | (#43608553)

Don't make it standard behavior.

E.g., instead of letting the designer specify "width", let him specify "content-width", or "outside-border-width", or "margin-width", etc.

And in case of conflicting specs (e.g. two or more conflicting attributes given) produce an error (don't choose a precedence order!).

Re:Completely agree (1)

Qzukk (229616) | about a year ago | (#43608725)

What box model would be best?

One that allows me to discover BOTH inside and the outside sizes so I can measure BOTH what will fit in my box, and what my box will fit in!

Thanks jquery!

Re:Completely agree (1)

Lumpy (12016) | about a year ago | (#43608101)

" given the arcane kludges needed to produce popular web-page layout effects easily achieved using evil tables and frames, the lack of 'constants' to set standard colours and measurements."

This, a thousand times this. Honestly, why the hell has CSS not been fixed? They could have easily added what was needed to make things a lot easier. but instead they force everyone to fight with it.

Re:Completely agree (1)

hcs_$reboot (1536101) | about a year ago | (#43608537)

You don't need another "I do agree 100% with what you said" since you already got the +5 In. But you just said a very nice way.

Re: Completely agree (-1)

Anonymous Coward | about a year ago | (#43607925)

Sitting here on the john, this big turd just aching, waiting to be pooped. Like a bullet in the chamber, aching to be fired.

What say you?

Re: Completely agree (-1)

Anonymous Coward | about a year ago | (#43608079)

She is straining, which causes compression, which brings about “unconsciousness” in the unborn child. Then, if she habitually talks to herself (a monologuist) as an enormous number of aberrated women do, she may say, “Oh, this is hell. I am all jammed up inside. I feel so stuffy I can’t think. This is too terrible to be borne.”

!Like (-1)

should_be_linear (779431) | about a year ago | (#43607613)

I see CSS as another attempt (previous one being VisualBasic) of non programmers, to sort of "program" something. CSS alongside 2 basic layers, regular code and HTML document itself, only creates additional unnecessary third layer of shit that eventually may introduce problems, as soon as someone starts playing with it

Re:!Like (5, Informative)

LizardKing (5245) | about a year ago | (#43607651)

Bollocks. CSS was designed to separate styling from structure in web pages. It does this admirably, and only needs to be a declarative language to do so. This prevents a lot of "clever" hacks that including conditional or flow statements would have encouraged. It's the same reason why statically typed languages are better than dynamic ones - since the tooling and compile time checks can be much more comprehensive and optimisation is easier - but clueless twats prefer the dynamic ones, since they don't understand the downsides or foolishly think they are so good they wont screw up. Improved programmer productivity claims for including flow statements in CSS (or using dynamic languages) are crap as well, since while a programmer might find it easier to cobble together something that just about works, chances are very high that it will be harder to maintain.

Re:!Like (0)

WillKemp (1338605) | about a year ago | (#43607797)

I like your turn of phrase! I also rather like dynamic programming languages. However, that's a totally different story to CSS. You can tell the people who don't understand CSS - they're the ones who whine about it. It's a shame they can't take some time off from whining and actually learn how to use it properly.That's too much effort, of course - whining's so much easier.

Re:!Like (3, Funny)

Rich0 (548339) | about a year ago | (#43607995)

Bollocks. CSS was designed to separate styling from structure in web pages. It does this admirably, and only needs to be a declarative language to do so.

Bollocks. Every configuration file should be Turing complete. -- The Sendmail Authors.

Re:!Like - Bollocks to your Bollocks (0)

Anonymous Coward | about a year ago | (#43608183)

Bollocks. CSS was designed to separate styling from structure in web pages.

Bollocks. CSS separates BOTH style AND structure from web pages. It wouldn't have been so bad if CSS actually did only specify style but unfortunately it also implements page structure. That is the problem with CSS. Tables, which used to create simple and easily managed structure in web documents, have been deprecated and replaced with CSS equivalents, except, of course that much of such CSS is often simply awful and relatively inconsistent and unreliable.

If only CSS did deal with just style. But CSS definitely is all about structure too.

Re:!Like - Bollocks to your Bollocks (1)

robmv (855035) | about a year ago | (#43608679)

You are confusing structure with layout. Tables are a used to define document structure, when the data to display is tabular. to use tables to layout the document when the contents of the table is not tabular data is plain wrong!

Re:!Like (1)

gl4ss (559668) | about a year ago | (#43608231)

if it only included a #define....

Re:!Like (4, Insightful)

BasilBrush (643681) | about a year ago | (#43607699)

CSS alongside 2 basic layers, regular code and HTML document itself, only creates additional unnecessary third layer of shit that eventually may introduce problems, as soon as someone starts playing with it

That's like saying MVC is unnecessary, and not just putting all your code in a single class/module/namespace may introduce problems. There are people that say that, but they are novices.

HTML5/CSS/JS is equivalent to MVC. The "VisualBasic" type people would tend towards trying to put everything in their HTML rather than the other way around.

What? (0)

Anonymous Coward | about a year ago | (#43607947)

Um, no. MVC is a design pattern (i.e. a set of concepts for programming) that can apply to any language, CSS is declarative style markup (that apparently some people think should be the next programming language) that depends upon another markup language (HTML, XML).

Maybe if you compared it to some other GUI markup, the analogy would hold, but MVC is not even in the same realm. You might as well use a car analogy. I think you should look up MVC. Maybe if you said AWT or Swing, that would be a little closer. VisualBasic also had these types of visual design elements that the GP was complaining about. So while maybe the GP was a troll.... WTF you talkin' 'bout wullis.

Re:What? (1)

BasilBrush (643681) | about a year ago | (#43607987)

Um, no. MVC is a design pattern (i.e. a set of concepts for programming) that can apply to any language, CSS is declarative style markup (that apparently some people think should be the next programming language) that depends upon another markup language (HTML, XML).

I'm happy that you know that. It's a shame you don't have the comprehension ability to see that nothing in my post said otherwise.

I think you should look up MVC.

I thing you should try teaching your grandmother to suck eggs.

Re:What? (1)

Anonymous Coward | about a year ago | (#43608069)

I think you missed the point of what BasilBrush was saying. Also, HTML/CSS/JS fit the MVC design pattern surprisingly well - the HTML is your data (model), the CSS is your view (in the sense that it controls presentation) and the Javascript is your controller (in the sense that it controls the application logic). It's just an analogy but surprisingly not far of the truth.

Re:What? (1)

sg_oneill (159032) | about a year ago | (#43608365)

Um, no. MVC is a design pattern (i.e. a set of concepts for programming) that can apply to any language, CSS is declarative style markup (that apparently some people think should be the next programming language) that depends upon another markup language (HTML, XML).

No. He got it right.
Done properly, HTML is semantic. Its data. Its not a neat paralllel to a model , but its in the ballpark.
CSS is the layout, its a view. It takes the model and presents it.
And Guess what Javascript is?!

Now your getting it!

Re:!Like (1)

CastrTroy (595695) | about a year ago | (#43608391)

You're going on like the only alternative to MVC is stuffing everything in a single file. While those of us who have been doing web development long before the idea of MVC have been separating out the business logic from the web page for a long time. There was stuff like N-Tier architectures which did a pretty good job of separating out the data storage from the business logic from the presentation layer. Personally I find this to be a lot better than MVC, because I find that MVC links the presentation too much to the underlying structure of the data.

Re:!Like (5, Informative)

dingen (958134) | about a year ago | (#43607723)

You have no idea what you're talking about. CSS (and HTML for that matter) have *nothing* to do with programming. CSS is merely a way for designers to code a layout, nothing more, nothing less.

I do agree CSS could have been a lot better and there are definitely some errors which needs fixing, but the general idea of separating mark up and layout is a sound one and selectors is one of CSS' best features.

No , sorry. (1, Interesting)

Viol8 (599362) | about a year ago | (#43607853)

All non progammatical web code has to do is describe a page. There is no reason on earth for requiring 2 completely different formatting languages - HTML and CSS - to do this. CSS is just a nasty hack on top of HTML which was already a hack anyway and along with embedded javascript its turned web coding into a total dogs dinner.

Re:No , sorry. (3, Insightful)

dingen (958134) | about a year ago | (#43607891)

You're crazy. CSS and HTML are completely unrelated languages and technologies. None is a hack on top of another. HTML describes the structure of a document, CSS defines how things look. It's that simple. They require a different syntax because they are used for different things. And they're both very successful at what they're trying to do. Sure there are problems, sure there are things wrong with it, but show me something perfect. There are two types of languages you know: ones everybody complains about and ones nobody uses.

I have no idea what you mean by "embedded Javascript", but Javascript is the programming language of the web. Contrary to HTML and CSS, Javascript is a "real" programming language by any definition. Without it web applications would not be possible and the web would merely be a document system. Instead its the world's largest application platform, allowing users on any device to use your applications. If you are a web developer and you think that's not exciting then maybe you should think of switching careers.

Re:No , sorry. (0)

Anonymous Coward | about a year ago | (#43607985)

HTML describes the structure of a document, CSS defines how things look. It's that simple.

In theory, yes. In practice, not so much.

Re:No , sorry. (1)

dingen (958134) | about a year ago | (#43608003)

How so? Care to elaborate or provide an example?

Re:No , sorry. (1)

RaceProUK (1137575) | about a year ago | (#43608191)

How so? Care to elaborate or provide an example?

http://www.w3schools.com/tags/tag_font.asp [w3schools.com]

Re:No , sorry. (1)

dingen (958134) | about a year ago | (#43608303)

Sure, HTML used to include tags for styling in the past. There was a time before CSS was invented and people wanted to make things look pretty after all. But these sort of tags have been regarded deprecated for at least a decade now.

Re:No , sorry. (0)

Anonymous Coward | about a year ago | (#43608351)

"The font tag is not supported in HTML5, and is deprecated in HTML 4.01."

Oops. (3, Insightful)

sidragon.net (1238654) | about a year ago | (#43608399)

First, you lose credibility for linking w3schools.com. Professional web developers wouldn't be caught dead referencing them. [w3fools.com] Second, you're referencing a tag that's deprecated because of CSS. Professional web developers wouldn't be caught dead using a font tag (or any other stylistic tags for that matter).

Re:No , sorry. (1, Informative)

Anonymous Coward | about a year ago | (#43608271)

I haven't seen somebody be so wrong here in years. Just about everything you said is bunk or outright bullshit.

dingen's bullshit claim: You're crazy.

WRONG. The GP's assertions are completely true, completely correct, and show a very high degree of sanity.

dingen's bullshit claim: CSS and HTML are completely unrelated languages and technologies.

WRONG. CSS and HTML are extremely intertwined and heavily related. Anyone who knows their history knows that they arose and evolved as a result of one another's flaws.

dingen's bullshit claim: None is a hack on top of another.

WRONG. CSS is a hack upon HTML, and HTML's evolution has been affected by the hack that is CSS. They're both hacks upon one another, over time.

dingen's bullshit claim: HTML describes the structure of a document, CSS defines how things look.

WRONG. HTML does affect the appearance of the document, and CSS does influence the structure. In any moderately complex web page, you'll need to consider both at the same time if you want to achieve anything like the desired outcome.

dingen's bullshit claim: It's that simple.

WRONG. If you had any real world web development experience, you'd know how utterly wrong this claim is.

dingen's bullshit claim: They require a different syntax because they are used for different things.

WRONG. They can both be represented using s-expressions. It's just that the original designers screwed up by not choosing this natural syntax, and none of the major players have chosen to right this wrong.

dingen's bullshit claim: And they're both very successful at what they're trying to do.

WRONG. They're essentially the only options available. That's not a sign of "success". Given all the problems people have with them, it's proper to classify them as failures.

dingen's bullshit claim: Sure there are problems, sure there are things wrong with it, but show me something perfect.

WRONG. There aren't just "problems". The technologies entirely consist of problems, and entirely exhibit problems. The only type of "perfection" they attain is being perfectly imperfect.

dingen's bullshit claim: There are two types of languages you know: ones everybody complains about and ones nobody uses.

WRONG. Wrong, Bjarne. There are languages that smart people use, just because they don't have to constantly complain about them. Python is a good example. JavaScript is not. And HTML and CSS aren't even programming languages, so what you quoted doesn't even apply here!

dingen's bullshit claim: I have no idea what you mean by "embedded Javascript", but Javascript is the programming language of the web.

WRONG. No, C and C++ are the programming languages of the Web. They power the operating systems, web servers, database systems, networking devices, high-level server-side programming languages, web browsers, and even the JavaScript implementations used today. JavaScript is a minor client-side player, at best.

dingen's bullshit claim: Contrary to HTML and CSS, Javascript is a "real" programming language by any definition.

WRONG. JavaScript is not a programming language. It's a stretch to even call it a scripting language. It's clearly lacking too many critical features to be considered a real programming language.

dingen's bullshit claim: Without it web applications would not be possible and the web would merely be a document system.

WRONG. This is by far the most incorrect thing you have said so far. Surprisingly capable web applications existed before JavaScript was first released in 1995, and even well after that, when people were still using browsers that did not support JavaScript. Furthermore, there's nothing stopping browser developers from embedding other languages in their browsers. I suppose you've never used VBScript with Internet Explorer. JavaScript is not essential in any way.

dingen's bullshit claim: Instead its the world's largest application platform, allowing users on any device to use your applications.

WRONG. It is not a "platform" in any sense of the word. It lacks far too much to be considered a platform. And your "any device" claim is completely laughable. JavaScript code does not run on a device like my toilet brush. Heck, it doesn't even run well on modern workstations with multiple powerful CPUs and massive amounts of memory.

dingen's bullshit claim: If you are a web developer and you think that's not exciting then maybe you should think of switching careers.

WRONG. He's exactly the kind of person who should be a web developer. He sees how damn broken it all is. It's not good to get "excited" when seeing so much utter crap. Only people who aren't blinded by some fanatical devotion to JavaScript, HTML and CSS will be willing to make the changes necessary to improve the situation.

In hindsight, I think your comment may actually be one of the stupidest and most incorrect I have ever seen. Not just within the past few years, that is, but ever. You were completely wrong on just about every point you made. Every single point!

Re:No , sorry. (1, Funny)

dingen (958134) | about a year ago | (#43608307)

This post is awesome! I'm saving it for later, thanks!

Unrelated technologies??? (1)

Viol8 (599362) | about a year ago | (#43608981)

Wtf are you smoking? HTML used to do presentation. And there's no reason it still can't. Please feel free to give the exact reason for CSS having an entirely different syntax and structure to HTML when XML which can store far more complicated data than CSS manages to have a pretty similar one.

If only we went back to the days of web coding (0)

Anonymous Coward | about a year ago | (#43607907)

before CSS, HTML and javascript.

You just don't like "web coding" at all, do you?

Re:No , sorry. (1)

RabidReindeer (2625839) | about a year ago | (#43607935)

All non progammatical web code has to do is describe a page. There is no reason on earth for requiring 2 completely different formatting languages - HTML and CSS - to do this. CSS is just a nasty hack on top of HTML which was already a hack anyway and along with embedded javascript its turned web coding into a total dogs dinner.

The purpose of HTML is to organize data for display - and possible return via a submitted form. The purpose of CSS is to control the presentation of that data. HTML was invented first, and originally had to shoulder some of the responsibilities of CSS, but CSS is now the preferred presentation control medium, not least of which is that it makes it possible to "skin" HTML to adapt it to multiple display devices and/or view preferences.

JavaScript exists to allow dynamic manipulation of client-side data, display organization and CSS in a way ensured maximize frustration due to language inconsistencies and client portability issues.

It is entirely possible to make an unholy mess of these three tools, and people who employ cheap inexperienced programmers generate a lot of it. However, done competently, it is possible to make a much cleaner job of it.

Re:No , sorry. (1)

Jason Levine (196982) | about a year ago | (#43608519)

CSS isn't a nasty hack, it's a necessity. Take a look at CSSZenGarden.com. Every time you switch to a different theme, the HTML remains the same. All that changes is the CSS file (and the images that it references). To do that with plain HTML and no CSS, you would need tags or attributes to represent each display style. This would mean changing the look of a page would require completely recoding it instead of simply updating the stylesheet. If you wanted to, for example, make all links red instead of blue you would need to edit every link instance on your website. This would take a lot more time than loading the CSS file and changing a { color: #00F; } to a { color: #F00; }. It would also make things like WordPress themes nearly impossible.

CSS makes modern web programming possible. Could it be improved? Definitely, but I couldn't imagine trying to create or update websites without it.

Re:!Like (0)

Anonymous Coward | about a year ago | (#43607887)

Decent code to generate a definition file, like HTML, is significantly more reliable than a human punching that code in. The only real purpose for CSS is to separate the property values from the actual definition of the page, reduces the chance that you'll accidentally change the wrong values and break the page.

I wonder how many crying out for "more dynamics" has actually tried XML with XSLT. It fits the web model so nicely with the data driven nature.

Re:!Like (0)

Anonymous Coward | about a year ago | (#43607895)

Isnt TFA making the case that it's almost a programming language?

Re:!Like (1)

dingen (958134) | about a year ago | (#43607901)

I don't think so. The fact that it's code doesn't make it programming.

Re:!Like (0)

Anonymous Coward | about a year ago | (#43608009)

The fact that it is interpreted by the browser and applied to the web page layout does.
It isn't a general-purpose programming language, and not even Turing complete, but neither of these is necessary.
It is a domain-specific language for styling. As it is not used for modelling but for the actual implementation (the line between both being blurry anyway), it is a domain-specific programming language, which is a special case of programming language.

Anyway, nobody will call it a programming language because "styling language" is more specific.

Re:!Like (1)

dingen (958134) | about a year ago | (#43608039)

I guess you're right. I was thinking of things like Turing-completeness, but I agree that is not actually necessary to make something a programming language. A player piano isn't a computer, but making a piano roll still is a form of programming.

Re:!Like (1)

Sique (173459) | about a year ago | (#43608171)

The fact that it is interpreted by the browser and applied to the web page layout does.

No, it doesn't. CSS is a description language, not a programming language. It just maps elements to the layout of said elements. Calling CSS a programming language would be akin to claiming, the mapping of numbers to colors in a paint-by-numbers would "program" the picture.

Re:!Like (2, Informative)

Anonymous Coward | about a year ago | (#43607725)

If that's what you think, then you don't understand why CSS and HTML are separate languages. The implementation is by no means perfect, but its a very good example of Separation of Concerns (separating content from presentation, and in javascript's case, both of those from application logic), something that all too many 'programmers' don't seem to have any idea about. Then again if you're one of those programmers who see SOLID principles as over-engineering then I can understand why you might think that its an 'additional unnecessary third layer'.

CSS as DSL? (0)

Anonymous Coward | about a year ago | (#43607623)

Is it possible to embedd CSS in another (non-browser) application to use it as an DSL?
Are there libraries available for example for C++ applications?

Re:CSS as DSL? (1)

prefec2 (875483) | about a year ago | (#43607657)

CSS is a DSL for styles primarily. It could be used for other stuff as well. There are libraries available in Java. However, I do not know of any C++ library. But google returns just a lot on the topic for "CSS c++ library"

Re:CSS as DSL? (0)

Anonymous Coward | about a year ago | (#43607729)

Thanks a lot.

Re:CSS as DSL? (1)

robmv (855035) | about a year ago | (#43608759)

Yes, I am using it for an internal XML dialect that need styling and for which HTML is not appropriate. We use the Apache Batik internal CSS processor (because we are using Batik for their SVG support, no need for a duplicate CSS processor independent of Batik)

Radio :checked selectors example for tabs etc. (0)

Anonymous Coward | about a year ago | (#43607677)

area :target selector example for map pan and zoom (0)

Anonymous Coward | about a year ago | (#43607715)

Is this a joke? (0)

Viol8 (599362) | about a year ago | (#43607841)

"For developers coming from imperative programming styles, it might seem hard to lose the ability to specify more complex logical flow. That loss, though, is discipline leading toward the ability to create vastly more flexible systems"

Err , no , sorry it isn't. Declarative systems are NEVER more flexible. They might be able to do some things in 1 line that imperative might take 100 lines to do , but when it comes down to it imperative will always be more flexible and powerful simply because it allows you far more control.A declarative language is always restricted to the particular set of problems that its creators tried to solve. If that wasn't the case then why has every dialect of SQL had procedural language add-ons? Why isn't Prolog used everywhere? Why has functional - which is only midly declarative anyway but we'll let that slide - taken over the world like its proponents constantly tell us it will?

Answers on a postcard.

I call BS.

Re:Is this a joke? (1)

dingen (958134) | about a year ago | (#43607857)

Why has functional - which is only midly declarative anyway but we'll let that slide - taken over the world like its proponents constantly tell us it will?

Don't you mean "why *hasn't* functional programming taken over the world"?

Anyway, it has. It's called Javascript and it's *huge*.

Re:Is this a joke? (0)

Anonymous Coward | about a year ago | (#43607933)

Javascript a functional language? Surely you jest. Call the haskell guys and tell them they are wrong.

Re:Is this a joke? (1)

cyber-vandal (148830) | about a year ago | (#43607969)

It has the "function" keyword duh!

Re:Is this a joke? (1)

dingen (958134) | about a year ago | (#43608139)

I know you're mocking, but in Javascript a function is a first class citizen. You can pass functions as parameters, return functions, keep them in a variable, create them at run-time. The fact Javascript has a curly braces syntax doesn't mean it can't be a functional programming language.

Re:Is this a joke? (1)

skids (119237) | about a year ago | (#43608847)

The fact Javascript has a curly braces syntax doesn't mean it can't be a functional programming language.

Actually the thing that makes a functional language a functional language has nothing to do with curly braces. The defining principle of functional languages is that you have to have special hacks built into the language that technically violate it's functionality in order to make it do anything -- eh -- functional -- due to the fact that side effects are the only useful way to get anything done.

Re:Is this a joke? (3, Informative)

dingen (958134) | about a year ago | (#43607973)

Javascript is much more a functional programming language than a procedural one. It's by no means as pure as Haskell, but this also allows it to be useful.

I suggest you read up on some of the articles by Douglas Crockford, who does an awesome job of explaining the true nature of Javascript to the world. This is a good starting point [crockford.com] .

If you don't believe Javascript is indeed a functional programming, here is a Google Talk by the same Douglas Crockford explaining how to do monads in Javascript: http://www.youtube.com/watch?v=b0EF0VTs9Dc [youtube.com]

By itself, I agree CSS is a good domain language (0)

Anonymous Coward | about a year ago | (#43607883)

Sure, by itself CSS is a good domain language for the problem it solves. The problem comes when you combine CSS with JavaScript and jQuery - sometimes I wonder if I am looking at a CSS selector or an anonymous JavaScript object because the syntax is so similar it all blurs together. Combine this with HTML and JSTL, two tag languages, and JavaScript and EL, two syntactically similar languages. Then put all four syntaxes into the same JSP file. I sometimes can't tell what's emitted HTML/CSS/etc and what's JSP/JSTL/EL. Any one of these is fairly elegant, but when you put them all together it's an unholy mess. Attempts to separate them further complicate matters.

Whatever else you can say about PHP, it's a whole lot simpler and somehow managed to escape J2EE's compulsive over-engineering.

Re:By itself, I agree CSS is a good domain languag (2)

dingen (958134) | about a year ago | (#43607929)

It sounds like your'e confused. And I can't blame you, because there are *a lot* of different languages and syntaxes involved in creating a web application these days and it can be challenging to grasp it all. It helps to separate things in your mind. Even though the syntax of e.g. a JSON file may look a bit like a CSS file, they are completely unrelated. Make sure you know what you're working on (structure, style, client side logic, server side logic) and only concern yourself with the things that are related to that, nothing else. PHP for example has nothing to do with anything on the client, so don't even realize it exists when you're working on something in the client :-)

Re:By itself, I agree CSS is a good domain languag (1)

Bazman (4849) | about a year ago | (#43608189)

No, a JSON file looks nothing like a CSS file, it looks a lot like a chunk of javascript though....

Re:By itself, I agree CSS is a good domain languag (1)

dingen (958134) | about a year ago | (#43608343)

You can't deny there's a very similar syntax going on (blocks of key:value pairs encapsulated by curly braces). I believe Crockford himself even said he came up with JSON after staring at a CSS file and realizing it looks a lot like a Javascript object.

CSS is amazing except when IE, Opera, or Safari (0)

Anonymous Coward | about a year ago | (#43608059)

IE9+ did things right, but Opera and Safari are still lagging behind tremendously. Opera isn't so bad in contrast to safari but holy crap, learn to stick with the w3c standards and support ALL code not just what you feel like supporting. I haven't had any client that cared to have safari supported but I remember at least a year ago when using transparent/semi transparent images on safari would end up being a hassle to write for. These days CSS is pretty fun to work with, virtually no need to write exceptions anymore for the most part unless your client really insists on wanting older browsers supported. Yes, it's more money but it's also infuriating to work with.

Practically Worthless. (3, Insightful)

VortexCortex (1117377) | about a year ago | (#43608209)

Think about it. It's practically worthless. We might as well be compiling CSS + HTML + JS into an interactive PDF format for all the times we actually reskin entire sites. Even mobile stuff is suspect -- I mean, yeah, I can have 10 different images to serve depending on the size of the display, and I automate that image asset generation... Then what? I make the images be CSS backgrounds? Isn't that defeating the point of separating the style from the content? Go the other way: Actually put the content wholly in the HTML, and only use CSS to style everything. Yeah, great, I can sort of reskin for printers and mobiles, but where's the detection mechanism? It's on the server side... Thus conflating the whole model, view, controller and the presentation, content, style, etc. I mean, JS to manipulate the view -- So, what, a segmented controller? CSS3 Animation instead? Oh, so that's a style thing now. Bah, whatever. A rose by any other name...

The problem is that designers would love to think these problems can be isolated and are separable. The reality is that they are not. Concentrating on making your CSS super flexible with selectors is merely mental masturbation. If it weren't then folks would be making CSS libraries for pulling off common styles and effects. Go to the "poster child" of CSS: CSS Zen Garden, and see for yourself. Tons of #id tags, tons of different designs, no one really taking any two designs and combining them with ease...

The reality of the situation is that the next person who comes along will just scrap the whole thing and re-make the design again anyway (yes, even if that person is you). Might as well be compiling it all down into a low level colored shape display system, that way we can implement CSS and HTML and even new markups atop it, instead of waiting for OVER HALF the age of the web just to move from HTML4.01 to HTML5...

Cross Site Scripting (0)

rock_climbing_guy (630276) | about a year ago | (#43608225)

Douglas Crockford says that Cross Site Scripting is called XSS for short because CSS would have been confused with Crappy Style Sheets

CSS is great, unfortunately designers can't use it (3, Insightful)

Bitsy Boffin (110334) | about a year ago | (#43608275)

CSS is great when used properly (although, somewhat hereticly, I would kill for definable constants a-la 'color: PRIMARY_WEBSITE_COLOR;' without resorting to dynamically writing the CSS ).

Unfortunately graphic (website) designers are completely shit at using it. Even simply understanding when they should use an ID and when they should use a class seems to a'splode their brain, "huh, what is wrong with using this same id a bajillion times in the page". Don't even try telling them that "redtext" is not a good classname. Heck half of the time it's ".span1"!

They don't even know (even after telling them half the time) that you can use multiple classes on a single element, let alone combine selectors, everything is a single ID or classname to them. The amount of copy-paste in most web designer's stylesheets is simply offensive, all because their brains don't allow them to modularise their desires into useful reusable CSS classes. Cascade? Inheritance? These are foreign words to the average website designer.

There is no point telling a designer how they should can make their CSS better, they just won't understand. Worse, if the programmer, who does know how to use CSS as it was intended, attempts to fix their stylesheets (or worse, cut up their photoshops into proper HTML and CSS), the original designer just won't understand how to do anything in the stylesheet anymore.

Re:CSS is great, unfortunately designers can't use (2)

itsdapead (734413) | about a year ago | (#43608923)

Unfortunately graphic (website) designers are completely shit at using it. Even simply understanding when they should use an ID and when they should use a class seems to a'splode their brain, "huh, what is wrong with using this same id a bajillion times in the page".

If CSS did what it said on the tin - separated content from style and layout - then graphic designers wouldn't have to bother their little heads about this sort of thing because they wouldn't need to touch the semantically-marked-up HTML.

Unfortunately, (a) CSS doesn't do what it says in the tin - changing the layout inevitably needs including exactly the right permutation of DIVs in the markup because CSS doesn't have any way of doing what every half-decent DTP package since PagerMaker 1.0 can do: defining a series of frames and specifying how text should flow between them - and (b) anybody who thinks style can be completely separated from content has spent too long reading & writing rigidly structured technical documents.

Don't even try telling them that "redtext" is not a good classname.

Hell no! Any idiot knows that a classname should be something semantic, like "rubric". ;-)

CSS should be a programming language (3, Interesting)

quietwalker (969769) | about a year ago | (#43608327)

Intellectually, I know that if it were more complex, there's no way it would have seen widespread adoption, and that markup is actually still complicated for many people. I can even look back at the early days of the web, when Marc Andreessen butted heads with Tim Berners-Lee about the media tag meant to display images, sounds, video and anything else and said, 'Screw it, you guys take too long to decide anything and it's over complicated, here's an img tag, done.' - and I can see how simple beats theoretically perfect and well designed.

However, we're already at the point of widespread adoption now, and it's a good time to have a new css that actually is a programming language, with flow control, dynamic calculations of element values, and so on. This is what we need to provide real separation between the document and how it looks. Anyone experienced enough to write non-trivial web applications that are meant to be run on a browser, tablets of varying sizes (including accounting for reorientation), and even cell phones knows that it's unrealistic to use a single page - you get sent to the 'mobile' variant of the page or elsewhere.

Css has been around for 16 years and it still lacks the ability to easily declare a completely separate layout based on display height or width, something like "If width is less than _x_, use this css, else this" or "set width equal to - 30". If you want those things now, you have to use javascript, and it's sometimes pretty awkward - like calculating the width of an element filled with content prior to displaying it.

To you folks who cite javascript to fix this, realize that css no longer manages the document display at that point, the javascript does. That means that css is missing something required to manage a display. It can only do some of it's job.
        - side thought; I'd be happy if css allowed javascript within the css. Assign values based on closures or predefined functions. Simple fix -

Re:CSS should be a programming language (1)

quietwalker (969769) | about a year ago | (#43608331)

Also, to you folks who are pants-on-the-head retarded, and think that html, css, and js equals an mvc, you are incredibly wrong. Javascript plus css is what defines the view, and that goes for all javascript outside of a few frameworks like Backbone that actually implement a real Controller pattern.

Re:CSS should be a programming language (0)

Anonymous Coward | about a year ago | (#43608559)

People like you are the problem.

"Let's add some simple logic to the config file" you say. Next thing you know, the who thing goes all sendmail on you and now you have to worry about bugs in two languages.

Re:CSS should be a programming language (5, Informative)

Jason Levine (196982) | about a year ago | (#43608659)

Css has been around for 16 years and it still lacks the ability to easily declare a completely separate layout based on display height or width, something like "If width is less than _x_, use this css, else this" or "set width equal to - 30". If you want those things now, you have to use javascript, and it's sometimes pretty awkward - like calculating the width of an element filled with content prior to displaying it.

Actually, you can do that. I do it all the time when I use responsive web design. Here's some sample CSS code:

@media screen and (min-width: 501px) and (max-width: 750px) { /* Put styles in here to reformat the page for larger tablets or small desktop resolutions */
}

@media screen and (max-width: 500px) { /* Put styles in here to reformat the page for mobile devices and small tablets */
}

@media print { /* Put all of your styles in here to format the page for printing. */
}

There is no JavaScript at work here. If you loaded a page utilizing this code in Chrome or FireFox (or IE10), disabled JavaScript, and resized the browser to make it smaller, you'd see the page slowly transform from a desktop version to a tablet version to a mobile version. (A good example of this is the Boston Globe's website: http://www.bostonglobe.com/ ). I can set styles for HTML elements and override them if certain conditions are met (max-width is between 2 values, screen resolution is a certain amount, print vs screen, etc). It might not be "if-then" statements, but it has the same effect.

Re:CSS should be a programming language (1)

dingen (958134) | about a year ago | (#43608717)

Css has been around for 16 years and it still lacks the ability to easily declare a completely separate layout based on display height or width, something like "If width is less than _x_, use this css

Erm... heard of media queries? They do exactly this.

@import url(narrow.css) (min-width:800px);

This loads stuff from narrow.css and applies it if your window is less than 800px wide.

And javascript? (0)

Anonymous Coward | about a year ago | (#43608335)

Mr. St Laurent seems to be talking about JS more than CSS. According to him the "future of web development" is in wrapping CSS manipulation in JS to create ever more complex, bloated, brittle webpages that can only function with low-security browser settings.
      And then of course there's that pesky problem of people expecting "content". Perhaps a giant JS library could solve that problem, too?

Ha!!! (0)

Anonymous Coward | about a year ago | (#43608349)

CSS kicks ass. I love it... Combine that with jQuery and HTML5 and you have some bad-ass sites that are fun to work with and use (as long as they're done right, of course, but hopefully that goes without saying).

Something that gets exhausting is dealing with people who have some axe to grind with this stuff. You see it in Java posts, you see it in PHP posts, you see it in ASP posts, you see it in Python posts...

Stop puckering your damn lip and go grab a different employer who caters to your development needs if it means that much to you to get away from .

Not Just jQuery (1)

BiggoronSword (1135013) | about a year ago | (#43608865)

There are other JavaScript frameworks, beside jQuery, that support CSS selectors. i.e. Prototype [prototypejs.org]
Load More Comments
Slashdot Login

Need an Account?

Forgot your password?

Submission Text Formatting Tips

We support a small subset of HTML, namely these tags:

  • b
  • i
  • p
  • br
  • a
  • ol
  • ul
  • li
  • dl
  • dt
  • dd
  • em
  • strong
  • tt
  • blockquote
  • div
  • quote
  • ecode

"ecode" can be used for code snippets, for example:

<ecode>    while(1) { do_something(); } </ecode>