Live data from Hacker News

Incomplete List of Mistakes in the Design of CSS

wiki.csswg.org

71–80 of 154 posts

Re: Incomplete List of Mistakes in the Design of CSS

#71

here's my pet peeves: 1. CSS should not have adopted a hyphenated naming scheme for properties, since it makes it difficult to access css properties from javascript or other languages. 2. CSS should never have been used for layout, and nobody should have suggested it should be. CSS defines properties on individual elements, while layout fundamentally needs to define relationships between elements, which requires real…

For #5 use rem which is based off the document font-size rather than the current elements font size. What really needs to stop is the use of pixels and absolute font sizes for sizing everything as they never work on more than 1 device/zoom level/default font size. Breaking layout into its own thing has its ups and downs. Basically you would have to break out what flexbox and grid do into a "layout" file, and come up…

rems don't work either because there are instances where you need to have things line up exactly. For example, if you have 3 columns. You will be one pixel out. There are no good ways to fix this. See [0]

https://johnresig.com/blog/sub-pixel-problems-in-css/

CSS should only be used to appease those ppl in your org that read/write more blog posts than code. Use JS if in doubt. You're welcome.

Re: Incomplete List of Mistakes in the Design of CSS

#72

Earlier quoted context omitted.

That's why I use CSS in JS :D. But we're just putting abstractions/stopgaps over a fundamentally flawed design. Not to mention, since everybody uses a different standard for isolation, CSS in JS is not compatible with BEM is not compatible with SASS, etc.

CSS was originally designed with the idea that you would have one css file for your whole site, and it would be maybe 300 lines max . We've obviously gone well off the rails. Selector specificity was supposed to be the scoping mechanism. And it works great in the original envisaged usescase: a single person making a single website. it just doesn't scale to large teams, and ancient software projects, with complicated…

It never worked well in the original envisaged usecase. CSS 1 didn’t work properly with tables which meant I used to have to inline style attributes for tables as well as set a CAS file. It’s always been garbage for centering things, in the early days that meant using the tag. Then you have all the different browser extensions (o-, mo-, etc) the inconsistent preferences for font-face, etc.

CSS was a great idea but it’s always been a garbage execution of that with no single browser following the spec correctly for years then each browser going off and adding their own crap when the spec ended up languishing (thank you W3C for sleeping while the web leapfrogged into the future).

I’m not a fan of HTML (I think that was good for it’s time but could use deprecation) nor JavaScript (but I’ll concede this is personal preference - however wouldn’t it be nice to have browsers run byte code so you could have a choice of languages rather than having compile everything down to JavaScript?) but CSS is easily the worst of a bad bunch in my personal opinion.

Frankly I don’t even get why people are defending it. Any programming tool that reduces the developer down to hours of trial and error just to do basic things is clearly a misstep. Sure, expert front end developers with years of experience and using bloated frameworks cope fine; but why have we allowed ourselves to get into this kind of mess in the first place?

I would honestly welcome a ground up complete reimplementation of the web if browser vendors all decided to work together on one.

Re: Incomplete List of Mistakes in the Design of CSS

#73

Most of these are nitpicks. Some are preferences that I would oppose. CSS is inspired by the style sheets of yore, of typeset publications made by ink-smeared metal pressed into paper. A magazine or newspaper might have a "style sheet" that said things like, "Paragraphs shall be 10-point Caslon" and "all second-level headings shall be hanging headings, outdented 5 picas." Before web browsers got a hold of them, style…

> CSS is inspired by the style sheets of yore

Which is in my opinion the reason why it sucks for most of its current use cases. Layout of a paper document and layout of a web page are very different. The web "page" often isn't even a page but rather a GUI for a computer program.

Re: Incomplete List of Mistakes in the Design of CSS

#74
post #8

Earlier quoted context omitted.

color is as much a property of font as size is

Traditionally, font is just the shape of the characters (size, weight, italics). Other things (alignment, underline, wrap, color). This is because "fonts" were originally physical typesetting blocks. Some designers go further and say font refers only to the files and file formats; other things are the "typeface".

I believe the traditional usage is something like this: Helvetica is a typeface, Helvetica Bold Italic is a font.

Re: Incomplete List of Mistakes in the Design of CSS

#75
post #73

Most of these are nitpicks. Some are preferences that I would oppose. CSS is inspired by the style sheets of yore, of typeset publications made by ink-smeared metal pressed into paper. A magazine or newspaper might have a "style sheet" that said things like, "Paragraphs shall be 10-point Caslon" and "all second-level headings shall be hanging headings, outdented 5 picas." Before web browsers got a hold of them, style…

> CSS is inspired by the style sheets of yore Which is in my opinion the reason why it sucks for most of its current use cases. Layout of a paper document and layout of a web page are very different. The web "page" often isn't even a page but rather a GUI for a computer program.

From the beginning, CSS tutorials said just what you said, that the web is not the printed page and that you should not strive for pixel-perfect layout.

Re: Incomplete List of Mistakes in the Design of CSS

#76

Earlier quoted context omitted.

pointer-events: none; is actually pretty useful in many cases when you temporarily need to disable interactions, like drag/drop

It's useful as long as every browser supports it. When it doesn't, and you want to polyfill, the polyfill needs to download all linked CSS files a second time, implement a CSS parser to find the pointer-events properties, and after all that, patch in not entirely identical behaviour with javascript. But then, this is behavior . what's it doing in a language that's supposed to be strictly about style/presentation? Why…

Out of curiosity, what browser do you need to support that doesn't support pointer-events?

Internet Explorer 10? No longer supported by the vendor, other than for Windows Server 2012 which likely won't be used by your user.

Opera Mini? What is your usecase? Opera Mini works very differently to other browsers. You can select the text whanever it's visible on the screen, even if it's covered by another element - as for this browser, the layout doesn't really exist. Disabling forms isn't as necessary, as Opera Mini waits for a script to finish once you press something.

Re: Incomplete List of Mistakes in the Design of CSS

#77
post #72

Earlier quoted context omitted.

CSS was originally designed with the idea that you would have one css file for your whole site, and it would be maybe 300 lines max . We've obviously gone well off the rails. Selector specificity was supposed to be the scoping mechanism. And it works great in the original envisaged usescase: a single person making a single website. it just doesn't scale to large teams, and ancient software projects, with complicated…

It never worked well in the original envisaged usecase. CSS 1 didn’t work properly with tables which meant I used to have to inline style attributes for tables as well as set a CAS file. It’s always been garbage for centering things, in the early days that meant using the tag. Then you have all the different browser extensions (o-, mo-, etc) the inconsistent preferences for font-face, etc. CSS was a great idea but it…

>I would honestly welcome a ground up complete reimplementation of the web if browser vendors all decided to work together on one.

Was that the sound of a pig flying by, or the sound of hell freezing over? Any time specs can be interpreted, there will always be these differences in browsers. Maybe we could not call them specs, and just call them suggestions?

Re: Incomplete List of Mistakes in the Design of CSS

#78
post #72

Earlier quoted context omitted.

CSS was originally designed with the idea that you would have one css file for your whole site, and it would be maybe 300 lines max . We've obviously gone well off the rails. Selector specificity was supposed to be the scoping mechanism. And it works great in the original envisaged usescase: a single person making a single website. it just doesn't scale to large teams, and ancient software projects, with complicated…

It never worked well in the original envisaged usecase. CSS 1 didn’t work properly with tables which meant I used to have to inline style attributes for tables as well as set a CAS file. It’s always been garbage for centering things, in the early days that meant using the tag. Then you have all the different browser extensions (o-, mo-, etc) the inconsistent preferences for font-face, etc. CSS was a great idea but it…

> wouldn’t it be nice to have browsers run byte code so you could have a choice of languages rather than having compile everything down to JavaScript?

How are those two situations different? You're compiling one language to another language. Does it matter if one of them is called "bytecode"?

Re: Incomplete List of Mistakes in the Design of CSS

#80

I don't think things like syntax and schemes are the real bad parts. The real bad part is that CSS is in no way designed to be interacted with by anything but CSS. Just yesterday I was making a music player position bar, and using CSS transitions to have it smoothely update itself. Set the duration of the transition and it goes on. But what about when the transition takes effect? JS doesn't know when a style is actua…

Off the top of my head, there are transition events, requestAnimationFrame, and most importantly the Web Animations API. So what you're saying seems to be false.
Post reply on HN