121–130 of 154 posts
Earlier quoted context omitted.
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.
It's not necessarily about pixel perfect. Even basic things like "two divs horizontally" are not intuitive in CSS, especially pre-flex-box.
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…
That’s exactly what collapsing margins are doing. It makes your div have 20px margin, not 40px. Imagine two blocks one above another. If margins were not collapsing - your divs would have 40px margin instead of 20 like you set.
> If I wanted a margin of a fixed size that doesn't dynamically change based on content
It does change based on browser width, that’s what most would want. From a designer perspective - the wider the element is - the more margin on top and bottom it should have for better readability. You don’t want your margins to be different for a list of various text items for example, it will look ugly. You want margins to be different based on a screen size.
A lot of the complaining in this thread is not what the article is about but I always find that too many people look at CSS usage from too high a vantage point without understanding the fundamental workings. It is that issue where people find themselves in trouble getting properties to interact with each other as expected. One example, and not the best one, is 'width'. People want 'width' to be the total width of an…
There are legitimate grounds to argue that the way CSS was specified is wrong . The fact that people find it so confusing is one. If people intuitively think that "width" is the total width of an element (an entirely reasonable assumption, mind), then that would imply that CSS chose an unnecessarily confusing name. Another is from the mental load perspective. If I'm doing a layout, I want to figure out how things fit…
If `width` only means the content, then a designer can plunk that same element down and adjust padding/margin to fit any design easily.
This is one example of an issue others would complain about.
Earlier quoted context omitted.
There are legitimate grounds to argue that the way CSS was specified is wrong . The fact that people find it so confusing is one. If people intuitively think that "width" is the total width of an element (an entirely reasonable assumption, mind), then that would imply that CSS chose an unnecessarily confusing name. Another is from the mental load perspective. If I'm doing a layout, I want to figure out how things fit…
Today, many people want to modularize components/elements for placement in an arbitrary way. That is, they want to be able to plunk down an element on any page and make it all work together. However, if one uses 'width' as the total width of the element, including margin, borders and padding, it could mean the spacing between the content, pre-arranged in that way, may not fit the design of the page giving it too much…
It's worth taking a look at how Windows Presentation Foundation does things, for example. It places the decision of whether to size individual elements according to their content size, the size of the container they're being placed into, or their total width front and center, in a way that, IMO, leads to less head scratching and compromises.
I think the issue here is that CSS was originally envisioned primarily as a styling tool, and layout functionality was bolted on as an afterthought, through a design-by-committee process. So, yes, it works, and anyone can learn it, but it would be nice if the overall effect were one of a technology that had a clear plan all along.
A lot of the complaining in this thread is not what the article is about but I always find that too many people look at CSS usage from too high a vantage point without understanding the fundamental workings. It is that issue where people find themselves in trouble getting properties to interact with each other as expected. One example, and not the best one, is 'width'. People want 'width' to be the total width of an…
Sure it's nuanced, and maybe imperfect, but I love it.
Earlier quoted context omitted.
> pinstriping (this one isn’t as popular anymore) That almost seems like an argument against designing CSS for what "people actually try to do" - what people try to do changes depending on the design language du jour. Better to have a generic specification for maximum flexibility, no?
No, because CSS is still chock-full of things that nobody ever wanted to do. Things in it that people used to want to do, but don’t as often anymore, are still more useful than those.
> Box-sizing should be border-box by default. It was for many years for >98% of the users when IE had near-total market dominance. But W3C rejected sanity and refused to fix the spec, insisting that IE should break every website on the planet and implement the W3C box model. This was a major PITA for anyone who cared enough to design a website that worked equally well in IE, Firefox, and Opera, which became an increa…
It never reached that high: IE was only around 80% at the time of IE6's release (and IE6 was the first version of IE/Win to support quirks mode, allowing the change without breaking sites; IE5/Mac had shipped a year earlier, but never had the marketshare its Windows counterpart had).
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…
It's not easy, but it's possible. All animated/transioned elements emit lifecycle events like animationstart/transitionstart so you can use those to orchestrate complex animations. This is AFAIK how ng-animate works internally.
"The Languages Which Almost Became CSS" https://eager.io/blog/the-languages-which-almost-were-css/
Earlier quoted context omitted.
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.
It's not necessarily about pixel perfect. Even basic things like "two divs horizontally" are not intuitive in CSS, especially pre-flex-box.