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

Things I wish I’d known about CSS

cssfordesigners.com

Post reply on HN
Print view View original

251–260 of 340 posts

Re: Things I wish I’d known about CSS

#251

Post by nharmonia »

k__ wrote: post #126

It always helped me to do an absolute basic concepts course on a new technology I learn. Like, sure I can play around in Photoshop or Eclipse or CSS or JavaScript and find most things. But a good 101 course is worth so much saved time. Most of the stuff in that article was mentioned in a CSS box model course I did 10 years ago. People were always baffled how I learned all this. Well, I read the docs! They always assu…

I have tried both approaches a fair amount, and realized that every time I try the cobbler approach I end up getting blocked on some major thing and thus having to rewrite everything because of some basic things that could have been avoided.

I feel like it's getting both better and worse now with docs getting better in general(no of times I end up on stackoverflow has gone down significantly), however a lot of times I end up on medium posts with a list of steps and absolutely zero reason why. Whenever I try cobbling from those articles, I end up very frustrated

Re: Things I wish I’d known about CSS

#252

Post by leephillips »

chrismorgan wrote: post #248
leephillips wrote: post #243

Earlier quoted context omitted.

Yes, your other point was something I hadn’t thought about. I guess his advice would be good for some people, but I’m not sure about the 99%. It’s not uncommon to use small images as text-like elements, and when you do that, if you have this reset, you will need to explicitly make them inline. Not a huge deal, but people tend to copy and paste their own CSS libraries between projects, and redefining basic default sem…

I’m going to stick with the >99% figure. I think it is uncommon, rare even. Other than chat systems with custom emoji rendered as an img, I honestly can’t think when I last saw a site with inline tags. (I’d guess it to be within the last month, maybe even the last week, but it wouldn’t surprise me if it wasn’t.) Twenty years ago, sure, but they’ve gone out of fashion stylistically as well as technically. Technically,…

It depends on what kind of sites you tend to visit, I guess. I see this several times per day. But I often visit pages with math on them. Before mathjax became standard, inline images was the only way to do it. And visit any Wikipedia page with math: they use mathML and have fallbacks, but the end result is, you are looking at inline images. Also, I often see such things as sparklines and similar things, also inline images. The >99% may be true of what you consume, but without data I am skeptical about the numbers.

Also, some people use CMSs that substitute inline images for missing Unicode glyphs, and other things. If it’s done well, you may not even notice. You don’t know if the correct figure is 99% unless you have examined the source of a sample of sites.

Re: Things I wish I’d known about CSS

#253

Post by balfirevic »

LandR wrote: post #178
dahfizz wrote: post #161

Earlier quoted context omitted.

Wow, that's just crazy to me. It makes sense with the much stronger safety net, it's just a shock. How does rent and food costs compare to America, do you know?

I'm in Scotland, my salary is about £45-£48k. I take home about £31k. The median salary here is about £21k nationwide. I bought my home for £170k, now worth about £230k. it's a decent sized apartment in a nice area in the city where I work. For an indication of size, my living room is about 23ft by 28ft, 2 bedrooms, 2 bathrooms. Some photos to show what I got for my money: https://imgur.com/gallery/6oNLRtl My outgoin…

Did you have a large down payment? That looks like a small monthly cost for such mortgage. Or maybe the interest on such loan in Scotland is very small.

Re: Things I wish I’d known about CSS

#254

Post by runarberg »

c-smile wrote: post #247

I believe that focal point of CSS understanding is that horrible display property. People just need to get that one as other stuff is relatively trivial. display:xxx on some elements defines three things ( sorry, that is terrible architectural mistake authors of CSS have made initially ) 1. display defines "sibling requirement" how that element wants to be replaced among its neighbors. `div {display:inline-box}` tell…

Don’t forget `display: contents` in which the element is instructed not to generate a box at all (neither inline nor block; I guess like `display: none` without hiding the content).

But I think the spec maintainers are aware of this and CSS Display Module 3[1] allows multi-keywords so you can do stuff like:

    display: block grid;
or:

    display: run-in ruby;
or even:

    display: inline flow-root list-item;
1: https://drafts.csswg.org/css-display/#the-display-properties

Re: Things I wish I’d known about CSS

#255

Post by thiht »

k__ wrote: post #126

It always helped me to do an absolute basic concepts course on a new technology I learn. Like, sure I can play around in Photoshop or Eclipse or CSS or JavaScript and find most things. But a good 101 course is worth so much saved time. Most of the stuff in that article was mentioned in a CSS box model course I did 10 years ago. People were always baffled how I learned all this. Well, I read the docs! They always assu…

I completely relate. Other things I learnt "formally":

- regexps (this is a big one, being able to write a complex regexp without thinking about it is amazing)

- Git

- basic JS when it was mainly used to add snow on your page

Taking the time to properly learn things is extremely valuable.

Re: Things I wish I’d known about CSS

#256

Post by wrycoder »

soperj wrote: post #202
theelous3 wrote: post #141

Earlier quoted context omitted.

Cobbler here, currently cobbling a frontend (am a backend dev by trade). The issue for me is the format these courses and resources take. CSS is the most jam packed with non-intuitive technology I've met. How many dozens of pages or segments of video would I have to go through in a course to learn what the author in OP summarised in two or three sentences? Any time I've considered the structured approach for somethin…

> Behold, 8 zillion words and symbols across 7 trillion seemingly randomly organised boxes full of both all of the information, and simultaneously none of the information, about css grids. It's interesting, because that's my go to resource for CSS Grid. I find it super handy when I forget something. Although, I'm not learning grid, I'm using it.

Reference books aren’t the same as textbooks.

And, typically, there are several levels of textbook. e.g. high school, then freshman physics, undergrad electrodynamics, then Jackson, then specialist references.

My point is you go over the subject completely several times, at increasing levels of sophistication.

Re: Things I wish I’d known about CSS

#257

Post by IggleSniggle »

benrbray wrote: post #226
IggleSniggle wrote: post #204

Earlier quoted context omitted.

Dear lord it's 2020 CSS has its own grid system, it's CSS Grid, and it's both easier to understand and more flexible than adopting the old frameworks. It also has variables, pseudo-selectors (which, like with html elements, you can invent new ones to suit your purposes), and more.

Is creating your own pseudo-selectors really possible? I like to think I'm pretty up to date on modern CSS but I've never heard of this.

Well, I wouldn't recommend it, but certainly you can programmatically apply a pseudo-element or pseudo-class and programmatically define behavior around those things.

Re: Things I wish I’d known about CSS

#258

Post by theelous3 »

runarberg wrote: post #234
theelous3 wrote: post #141

Earlier quoted context omitted.

Cobbler here, currently cobbling a frontend (am a backend dev by trade). The issue for me is the format these courses and resources take. CSS is the most jam packed with non-intuitive technology I've met. How many dozens of pages or segments of video would I have to go through in a course to learn what the author in OP summarised in two or three sentences? Any time I've considered the structured approach for somethin…

Your evaluation is problematic. I am a front-end dev by trade and I could really easily say similar things about the tech stack you work with daily. If you want a good reference and a learning guide start with this: https://developer.mozilla.org/en-US/docs/Web/CSS it is what us professional use. For us professionals that use CSS in our jobs, that have put the same amount of hours into front end technology as you have…

"here I am, at the end of the maze, telling people at the beginning how straight forward it is" is basically all I'm getting here - and you call my eval problematic.

Multiple accounts of people not in your position telling you a problem exists. Ok, great, you worked through it. Doesn't mean it's as good as it should be.

Re: Things I wish I’d known about CSS

#259

Post by megous »

c-smile wrote: post #247

I believe that focal point of CSS understanding is that horrible display property. People just need to get that one as other stuff is relatively trivial. display:xxx on some elements defines three things ( sorry, that is terrible architectural mistake authors of CSS have made initially ) 1. display defines "sibling requirement" how that element wants to be replaced among its neighbors. `div {display:inline-box}` tell…

You can define those inisde/outside display styles separately, like `display: inline grid` or `display: block flex`

Re: Things I wish I’d known about CSS

#260

Post by [deleted] »

runarberg wrote: post #236
benrbray wrote: post #226

Earlier quoted context omitted.

Is creating your own pseudo-selectors really possible? I like to think I'm pretty up to date on modern CSS but I've never heard of this.

I might be wrong but I think GP is talking about shadow parts[1] my-element::part(custom-selector) { /* ... */ } 1: https://developer.mozilla.org/en-US/docs/Web/CSS/::part

[deleted]
Post reply on HN