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

Hell Yes CSS

wizardzines.com

Post reply on HN
Print view View original

111–120 of 120 posts

Re: Hell Yes CSS

#111

Post by weare138 »

goto11 wrote: post #67
randomsearch wrote: post #53

Earlier quoted context omitted.

This isn't fully formed in my mind yet so go easy: Intuition is linked to elegance, an elegantly designed language is intuitive. An elegant language is one that starts with a few core principles and from that derives the rest of the language. Lisp is an example of a programming language that does this beautifully well. Usually (always?) such core principles themselves are taken from mathematics. After all, maths is h…

This is more a failure of the tutorials than of CSS itself though. CSS has a pretty simple and elegant core. You just have to understand the problems it was designed to solve. - Readable documents at any screen dimensions or resolution (i.e. you should not need to scroll horizontally back and forth to read each line just because you have a smaller screen.) - Incremental rendering - the document could be rendered as t…

>This is more a failure of the tutorials than of CSS itself though.

But therein lies the rub. Where do you go for authoritative information on CSS that doesn't involve digging through winding, terse technical specifications? That may be fine for developers making web browsers but becoming an 'expert' in CSS shouldn't be a requirement just to make a web page. Hell, even the experts struggle with it otherwise all web browsers would have consistent CSS rendering. A good example is centering an element in CSS. What's the right way to do it? There's a multitude of techniques with varying advantages and trade-offs. I first cut my teeth in web development in 2001 and we still don't have a simple, straight forward, codified way to accomplish this seemingly simple task. Instead we have an ever changing standard coupled with a dizzying amount of opinions on the matter and inconsistent browser support on mobile devices. We can't really blame the failure of tutorials when there's no clear authoritative reference point to work from.

Re: Hell Yes CSS

#112

Post by josefresco »

strenholme wrote: post #40

I’m just glad we’re no longer in the IE6 days where getting something as simple as a stable three-column pure CSS layout was a nay-to-impossible challenge. IE9 was probably the first version of IE with decent CSS (read ”display: table” which wasn’t broken); all of the other browsers (which didn’t have IE9’s market share at the time) had already added “display: table” support. Before “display: table” was widely suppor…

Having lived through the "IE days", we're now in the "Chrome days" and the outcome will be no better.

Re: Hell Yes CSS

#113

Post by strenholme »

toyg wrote: post #86
CaptArmchair wrote: post #83

Earlier quoted context omitted.

But HTML doesn't say anything about how things need to be rendered / presented. It was never intended to do that. All it does is mark the structure in a document. "This is a header", "this is a paragraph", "this is a quote". That's basically it. The "hypertext" part of HTML refers to the notion that it uses URI's that can be used to identify resources, and dereference them. It's entirely up to the consumer of a HTML…

HTML absolutely used to “say how things needed to be rendered”: with tags like B, I, FONT and so on. It was developed when documents were expected to be WYSIWYG-style markup (Word/WordPerfect, Latex, etc). CSS was designed to strip that away only after people decided the future of hypertext should look more like XML. In doing so, they added the constraint that you should be able to get completely different outputs de…

Actually, the original HTML was not designed to have the end user agent determine how a page looks, and was designed to specify presentation. was not part of the original HTML specification. was never meant to lay out a page.

The WYSIWYG-like tags were added in the late 1990s during the dot-com era because companies wanted to be able to make web pages “glossy brochures” and were doing things like making web pages huge imagemaps until Netscape added HTML tags specifying presentation.

Re: Hell Yes CSS

#114

Post by Jweb_Guru »

mantap wrote: post #66
Jweb_Guru wrote: post #60

Earlier quoted context omitted.

That is not why you're not supposed to use tables for layout. It is for accessibility reasons. This is routinely ignored because approximately 0% of rich web apps are accessibility-friendly and people with screen readers have pretty much just learned to make do.

Wouldn't accessibility software back then have been able to deal with table based layout, considering most websites were constructed that way?

No, they weren't, at least not usefully. It was a major problem and made a lot of the internet unusable for vision-impaired people.

Re: Hell Yes CSS

#115

Post by dheera »

brundolf wrote: post #7
dheera wrote: post #6

So many years into CSS and it's still damn near impossible to (a) vertically center multi-line text in a div (b) set the width of a div or video in units other than pixels and let the height be set based on an aspect ratio. Both result in nested div hell.

The answer to (a) (along with many other things) is to use Flexbox: .my-container { display: flex; justify-content: center; align-items: center; } This should work for (b) as long as the height isn't in terms of a percentage: .my-video { --my-video-height: 120px; height: var(--my-video-height); width: calc(var(--my-video-height) * 16/9); }

Wow thanks, I'll try this! (for (a) I was using table->table-row->table-cell to get vertically centered text before).

Re: Hell Yes CSS

#116

Post by strenholme »

goto11 wrote: post #76
strenholme wrote: post #55

Earlier quoted context omitted.

For layout?? Burn the heretic! [1] The real reason we don’t use tables for layout (and only for the occasional tabular data) is because a table layout doesn’t work really well on the screen of an iPhone or Android phone, especially when they are vertically aligned. So, the workaround is to use media selectors: Desktops, laptops, and tablets get a table layout; phones get a simpler one-column layout. I believe grid an…

I have never seen anyone arguing was not OK for tabular data. I thought this was a myth on level of teenagers eating tide pods.

Those kinds of discussions have dropped off of the Internet over the last decade and a half, being hosted at places like the now defunct original Digg website. It was an era when one could said something really stupid online and it would become mercifully forgotten.

What I have found is a 2014 blog posting where another web designer from that era says “the early anti-HTML table movement was strong. It managed to brainwash many generation of developers into thinking that any usage of table is evil. [...] I am one of those developers who avoided table layout, even for displaying tabular data.”

Reference: https://colintoh.com/blog/display-table-anti-hero

Re: Hell Yes CSS

#117

Post by randomsearch »

chrisweekly wrote: post #95
randomsearch wrote: post #53

Earlier quoted context omitted.

This isn't fully formed in my mind yet so go easy: Intuition is linked to elegance, an elegantly designed language is intuitive. An elegant language is one that starts with a few core principles and from that derives the rest of the language. Lisp is an example of a programming language that does this beautifully well. Usually (always?) such core principles themselves are taken from mathematics. After all, maths is h…

I hear you and think you make great points. Thankfully, there IS a resource and approach to using CSS properly, embracing the nature of the browser environment and building up from profoundly well-researched and -articulated first principles. The approach is called "Axiomatic CSS", and the website is https://every-layout.dev . Disclaimers: 1. No affiliation, just a grateful follower. 2. The site includes a mix of fre…

This actually looks really great, thanks for sharing!

Re: Hell Yes CSS

#118

Post by eurasiantiger »

kstenerud wrote: post #99
brundolf wrote: post #33

I wrote a (much shorter) article in a similar vein a few years ago: https://css-tricks.com/css-is-awesome/ I find it fascinating (saddening, but fascinating) that so many programmers are so turned-off by CSS and find it so unintuitive. I almost want to set out on a research project to figure out why that is. My experience with it couldn't be more different. Here's one way of looking at CSS (which I didn't think of un…

The problem is that most CSS properties are contextual. They'll work one way in a certain hierarchy, and a different way in another. I've had issues where items would suddenly appear in REVERSED order if I changed the width of the container object (which would be fine if there were a CSS property "component-alignment: reversed", but there isn't). There are no enforced types. You can assign any value to any property n…

What you’re saying is ”I don’t understand what ’cascading’ means in CSS”

Re: Hell Yes CSS

#119

Post by unabst »

Jweb_Guru wrote: post #60
unabst wrote: post #58

Earlier quoted context omitted.

Exactly. td supported vertical-align:middle since css1. But you're not suppose to use tables because... hmm. The user sees no difference. Google doesn't care. The browser has no problem with it. It's easier to code. Oh, but it's bad practice... how? I feel like we just listed what qualifies as good practice. What is it called when following rules only leads to breaking rules? Hint: Sometimes it even leads to javascri…

That is not why you're not supposed to use tables for layout. It is for accessibility reasons. This is routinely ignored because approximately 0% of rich web apps are accessibility-friendly and people with screen readers have pretty much just learned to make do.

This is such an oversimplification. Since when did a table contribute to the richness of an application? Most modern sites are built with divs and remain inaccessible.

Tables simplify the code for simple content placement. That's it. It's only one of a long list of requirements to satisfy all sorts of requirements including screen reader compatibility. And if one were to use tables, it's only one of a long list of hacks and non-hacks that would break screen readers.

The root of the problem is with web designers not prioritizing accessibility-friendliness in their sites to begin with, for the basic reason that it prevents them from building the site that they need to build. And "what breaks or doesn't break accessibility" is not part of the spec description and is not enforced technically. We get recommendations, but it's up to us to test everything against everything else and compromise. Not just with accessibility but with everything else as well including backwards compatibility.

Re: Hell Yes CSS

#120

Post by brodie »

josephg wrote: post #21
brodie wrote: post #20

Earlier quoted context omitted.

Your elementary school teacher would give you dirty looks if you said it, but your teenaged and adult friends would give you high fives and "hell yeahs" right back.

It also depends on where you are. Here in Australia, hell / damn aren't considered bad words. I think americans have a perception that australians swear a lot. We do - but also, a lot of what my american coworkers considered swearing doesn't register as swearing in my head. Here in australia (at least how I was raised), "hell" is just a word.

America is culturally all over the map (and literally too I suppose?), maybe more so than Australia. While the child-in-school thing might be universal across each state, there are many places were the word hell isn’t profane.

Hell, sometimes it would be weird and just plain confusing not to say the word!

Post reply on HN