Hacker News Board Hacker News, browsed like a classic message board
Live data from Hacker News

Incomplete List of Mistakes in the Design of CSS

wiki.csswg.org

Post reply on HN
Print view View original

101–110 of 154 posts

Re: Incomplete List of Mistakes in the Design of CSS

#101

Post by pjmlp »

bsheir74 wrote: post #44

Css is fine. Not perfect but fine. It's an approachable way to style documents that look ok on different devices. It's best when used sparingly. When I see people complain about css, they usually fall into a few camps. First theres the person who wants everything to look the same everywhere. They want web design to work like a print document. Sorry but thats now how it works. And then theres people who are writing we…

The problem is that there are plenty of us, because although it is possible to make a living with native projects, it is Web that pays most of the bills on UI development.

At least 2018 is the year we finally catch up with the native 90's regarding components.

Re: Incomplete List of Mistakes in the Design of CSS

#102

Post by quakenul »

laumars wrote: post #94
scns wrote: post #88

Earlier quoted context omitted.

Learn CSS Layout the pedantic way at: http://book.mixu.net/css/ can help with the trial and error bit. It impossible to get an intuitive feel for nearly 400 keywords IMHO.

That's great reference (thank you for the link) but one of the great - if not the single greatest - accomplishments of the web was that it allowed anyone with a text editor and access to the internet to publish content with ease. I get that commercialisation of any platform will lead to specialities in that field; however the tools shouldn't make it objectively harder for new comers to contribute. Let alone discrimin…

It is as simple as it ever was to do what could be done 15 years ago with a simple text editor and access to the internet. Any adjoining aspect has gotten easier and cheaper by a magnitude.

It's just that what people want has gotten a lot harder to build.

Re: Incomplete List of Mistakes in the Design of CSS

#103

Post by sireat »

I get a serious case of impostors syndrome when it comes to CSS. 20+ years of HTML, 15+ of writing Javascript, loving ES6 but CSS gives me fits.

What I hate the most that there really is no clear parent - child abstraction.

This parent child abstraction (all the way down to turtles) is present in most reasonable UI frameworks. I'll take Windows Forms or Qt any day of the week over CSS.

In CSS this abstraction leaks all over the place. Elements can do whatever the hell they want (z-index, pos, box sizing before International Border-box Day, etc).

CSS Grid was supposed to solve layout. It still has a long way to go.

For example, teaching at a bootcamp I ran into the following:

https://learn.freecodecamp.org/responsive-web-design/css-gri...

By setting a hard limit in pixels(as required in the exercise) you break the grid for smaller sizes because items go outside parent.

So what do I tell my students? Avoid px whenever possible, use media queries, em/rem and percentages.

That's all good, but there is no coherent mental model to think about UI besides bunch of arbitrary boxes which can do ANYTHING.

In a good UI your child elements should stay within the parent(via scroll etc), not so with CSS. There are no guarantees whatsoever. Someone will come up with !important !important pretty soon.

Re: Incomplete List of Mistakes in the Design of CSS

#104

Post by archergod »

devwastaken wrote: post #20

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…

even HTML cannot communicate with JS, you are talking about collective Web page behaviour running in JS/CSS/HTML/Browser. CSS is standalone, it doesn't have logical brain. It don't think. That is part of JS. I don't agree with your idea, if we add logic to all HTML and CSS then it is like batman doing killing.

Re: Incomplete List of Mistakes in the Design of CSS

#105

Post by windwake12 »

Zarath wrote: post #35
usaphp wrote: post #33

Earlier quoted context omitted.

They seem to be confusing when you are just starting designing, but once you spend more time with it - most of it starts to make sense > The fact that margin-top and margin-bottom percentages are computed based on the width of the parent element, not the height. It's actually much better this way, imaging a block of text with varied content. If you had margins calculated based on a height - you will have a margin tha…

> It's actually much better this way, imaging a block of text with varied content. If you had margins calculated based on a height - you will have a margin that depends on text content size, which is wrong, instead you want your margins to depend on a screen size width, not the content inside So using width to compute a vertical margin is somehow a better solution? If I wanted a margin of a fixed size that doesn't dy…

CSS and HTML will usually afford a specific approach. Being a web developer is knowing what these approaches are, and to know when stuff might get "not nice". So when you see a graphic designer using multiline text blocks with elided text in their design layouts, you know to raise a red flag and get that removed.

Personally, I've not found collapsing margins a huge issue either way. It's just the way it is. There's 10 billion ways to add distance between two elements in the browser, so pick a solution and go with it.

Re: Incomplete List of Mistakes in the Design of CSS

#106

Post by dcbadacd »

koboll wrote: post #8
maxxxxx wrote: post #4

Earlier quoted context omitted.

Color is not a property of font so I'd stick with "text-color"

color is as much a property of font as size is

Yeah, but fonts being recolored is a different thing than fonts having a color. https://www.colorfonts.wtf/

Re: Incomplete List of Mistakes in the Design of CSS

#107

Post by laumars »

quakenul wrote: post #102
laumars wrote: post #94

Earlier quoted context omitted.

That's great reference (thank you for the link) but one of the great - if not the single greatest - accomplishments of the web was that it allowed anyone with a text editor and access to the internet to publish content with ease. I get that commercialisation of any platform will lead to specialities in that field; however the tools shouldn't make it objectively harder for new comers to contribute. Let alone discrimin…

It is as simple as it ever was to do what could be done 15 years ago with a simple text editor and access to the internet. Any adjoining aspect has gotten easier and cheaper by a magnitude. It's just that what people want has gotten a lot harder to build.

The removal of the tag in place of CSS black magic is definitely not "easier" than it was 15 years ago. However I suspect this is going to be one of those debates that we have to agree to disagree on.

I should add that I don't disagree with the deprecation of from a language purists perspective. However it was still a step backwards in terms of ease of development when centring stuff in CSS is so clunky in comparison.

Re: Incomplete List of Mistakes in the Design of CSS

#108

Post by XCabbage »

devwastaken wrote: post #20

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…

> But what about when the transition takes effect? JS doesn't know when a style is actually updated and can then have a new property overwriting it to make the transition happen. If you do properties too quickly the transition won't happen. Such as if a user clicks on the bar to change the position, I have to hack in a 100ms setTimeout to set the new transition duration after stopping the transition with transition:none;

There's a slightly more reliable and less ugly hack than using a timeout, which I _think_ is applicable to the scenario you're describing: instead, force a reflow by reading the element's .offsetHeight. I wrote about this on Stack Overflow years ago: https://stackoverflow.com/a/16575811/1709587

Not disagreeing with the overall thesis of this post, just pointing out a slightly less annoying way to work around the problems from application-developer-land.

Re: Incomplete List of Mistakes in the Design of CSS

#109

Post by mcphage »

ZenPsycho wrote: post #50
mcphage wrote: post #22

Earlier quoted context omitted.

> Layout was hacked in to css by abusing the "float" property into doing things it was never meant to be doing. So if CSS wasn’t supposed to do layout, despite that being what people needed, and if you weren’t supposed to use tables for layouts despite that being what worked... then what on earth were you supposed to be using for layout? I don’t recall any other serious options out there.

there weren’t any. the official w3c answer was basically “why on earth would you want to layout a webpage?! stop doing that!” Ideology trumped practicality and we’re stuck with the consequences. or another way of putting it is they viewed web browsers as something more like a feed reader/news reader. that the browser and user should have control of how the information is presented, not the individual websites, which…

> the official w3c answer was basically “why on earth would you want to layout a webpage?! stop doing that!”

And that's the heart of my frustration. w3c designs things, not based on what people need, or even what people want, but instead what they think people should be doing. So many problems of the web stem from the fact that the committee who's supposed to be directing the design of web technologies, has no interest in how people actually use the web. That creates a power vacuum which gets filled by browser manufacturers, who at least have an interest in the people using the web's needs.

Re: Incomplete List of Mistakes in the Design of CSS

#110

Post by mcphage »

dwd wrote: post #68
mcphage wrote: post #5

(1) it should have been designed around what people actually try to do: three column layouts with headers and footers, aligning content in the middle, pinstriping (this one isn’t as popular anymore), drop shadows, etc. Instead, all of these things required either hacky workarounds, or stepping outside of CSS entirely. The first decade of CSS was “look at all these things you can do that you don’t want to, and you can…

> (1) it should have been designed around what people actually try to do It was but a lot has changed in the last 20 years. At the time CSS was first supported in most browsers, the way to create columnar layouts was with a frameset. They even handled fixed position headers and footers. I can't believe I've been writing CSS for 20 fucking years.

> the way to create columnar layouts was with a frameset

Ohgod, I forgot about that one. Ugh. Of all the bad ways to make a 3-column layout, that one was definitely the worst.

Post reply on HN