A lot of issues are simply solved by switching to flex.
Things I wish I’d known about CSS
261–270 of 340 posts
Re: Things I wish I’d known about CSS
#262Earlier 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?
Even with the stronger safety net, it doesn't make up for the difference compared to the US for well-paid employees (such as engineers, or tech in general). US employees are much more well-off, there's no denying that. US levels for engineers compare more to Swiss level of living. However the safety net is much more beneficial for less-paid people, at a relatively low cost for them. I only visited the US so others mi…
I have worked in the US and Europe, and may give a direct comparison.
US healthcare and education consume a vast portion of your pay. We paid cash for our daughter's college (biomedical engineering) at a total of over $300K. That buys her freedom of choice when it comes time to take a job, get an advanced degree, etc. Her colleagues will have more than $500K USD debt hanging over their heads when you factor interest payments.
The company pays for a portion of health insurance, but much of the cost is picked up by the employee, either though co-payments or deductibles.
We live modestly, drive low-end cars and don't dine out often. We see our European friends taking great vacations and their children bounce in and out of college programs. We see free healthcare, mountain cottages, and other perks unavailable to us.
Re: Things I wish I’d known about CSS
#263Earlier quoted context omitted.
You seem to be trivializing css as something static you just have to deal with. This maybe true for 99% of websites but css has had more innovation in the last few years than anything else. And much of it hasn’t reached textbooks. For example css3 functions and now being able to mix these new techniques in undiscovered ways. CSS requires a very nimble and creative mindset. That maybe why backend devs usually are very…
Have you looked at Definitive CSS? It's up to date and a massive 1000 page tomb of encyclopedic knowledge and guidance. Anyone who digests that entire thing is not being dismissive of CSS. Digesting that is taking CSS more seriously than most people take learning new programming languages...which is appropriate! Because with CSS, you not only need to learn the language, you are effectively learning something like a l…
> Have you looked at Definitive CSS? It's up to date ...
Not really, it doesn't talk about custom properties, inline svg, how to style them, etc. All very useful these days, if you want to allow color theming for your web app and not use hacks like custom fonts for icons...
And custom properties are around since 2014 at the very least.
Re: Things I wish I’d known about CSS
#264An element that has:
display: inline-block
That is, the element is inline for the containing block, but its children feel like they are in a block.
An inline-block element can be vertically aligned with respect to the baseline: it acts a bit like a character in a paragraph. That's why you can vertically center things using vertical-align:center on an inline-block element.
At least, this is my intuition of inline-block, this comment is far from being normative.
Re: Things I wish I’d known about CSS
#265Guys we need to talk. Are you capsbold serious? These are things that you learn in a first week of doing web development tutorials. I read this thread and it makes me think that I'm delusional because of a heat wave. Margins collapse? :focus exists? Me not getting a joke? I don't understand.
> These are things that you learn in a first week of doing web development tutorials.
You meant CSS tutorials? Never read about "margins collapse" in web development tutorials.
Web development tutorials I read (like 10 years ago) were usually about having a web server renders some data queried from a database into some basic HTML. And adding a form to create/edit rows in the database. Then perhaps adding some basic style like colors and paddings and some jQuery to validate the form. Finally moving that page from localhost to internet.
Let's be honest, web development covers a very large area of knowledge and CSS is not the most interesting part (not saying CSS is not interesting!). I guess most people just skip the CSS documentation and learn it by inspecting other pages and copying rules, and searching "how to do X in CSS" and reading tutorials about their specific question.
Re: Things I wish I’d known about CSS
#266I 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.…
That is not a fix - just a cosmetic change that does not solve anything.
display/flow MUST BE [1] different properties as they define orthogonal concepts.
We should be able to define them separately.
main { display: block; flow:grid; }
@media handheld and (width I've seen too many times errors like this:
main table { display:none; }
main.full table { display:block; }
[1] https://tools.ietf.org/html/rfc2119 [2] https://sciter.com
Re: Things I wish I’d known about CSS
#267Meanwhile, this is, oh so damn outdated. (I'm not kidding)
Most people don't know that the flow model totally changed meanwhile, and something like "display: inline-block" actually means "display: inline flow-root", everything that came after flexbox kind of had an influence to the meanwhile borderline insane display model as a result.
Everything related to inset, margin and padding has gotten an overhaul that is ready for ltr and rtl content where they switch x/y flow based on "direction: ltr (or) rtl" whereas e.g. "margin-inline" and "margin-block" are the newer properties for the updated margin.
A lot of stuff has changed for the better, too.
CSS transforms are now specified in a cleaner way, with a predictable way to render them (e.g. translate rotate will not be different than rotate translate). So all CSS transforms have gotten their own properties like "rotate: 90deg" or "scale: 1.23".
I learned a lot when I read through the actual CSS specifications, because I am implementing my own parser (for my Browser [1] project).
Also, did you know that @media, @supports and @viewport queries can be nested in any order? The media queries 4 [2] spec is kind of insane from an implementor's view.
[1] https://github.com/cookiengineer/stealth and https://github.com/cookiengineer/stealth/blob/X0/FEATURES.md
Re: Things I wish I’d known about CSS
#268Earlier quoted context omitted.
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.
My down payment was £70k, interest rate is 2.14%
When I renew at end of year it shoul be around 1.1%
Re: Things I wish I’d known about CSS
#269Earlier quoted context omitted.
Sometimes I wonder why companies even pay developers so much in the US. It boils down to real estate prices combined with some companies really really really wanting those people to be on site. I had my highest rate ever during a brief, beautiful moment in Switzerland where a studio apartment costs ~$2000 per month. I choose to think that this rate is how much our work is actually worth - otherwise those companies co…
This is a catch 22, high wages make the rent increase (demand and offer) and high rents demand high salaries, it's a spiral going to a bubble.
Housing supply is the variable that can act as a release valve. If cities don't want to expand vertically, that's fine, but they'll inevitably end up in a Bay Area type rent spiral.
I think the real issue is that homeowners vote so much more frequently than renters (who would love to have more housing and lower rents), even though they're technically outnumbered.
Re: Things I wish I’d known about CSS
#270Meanwhile, this is, oh so damn outdated. (I'm not kidding) Most people don't know that the flow model totally changed meanwhile, and something like "display: inline-block" actually means "display: inline flow-root", everything that came after flexbox kind of had an influence to the meanwhile borderline insane display model as a result. Everything related to inset, margin and padding has gotten an overhaul that is rea…
I'm a layout implementor for Planimeter's Grid Engine. Implementing a naive subset of the algorithm for calculating the box sizes in the visual formatting model and calculating layout for normal flow, relative positioning, and absolute positioning is far easier to implement than flexbox.[1] There's nothing insane about this. And you'll learn even more when trying to draw to the screen.
Normal flow also doesn't require multiple passes, whereas flexbox does.[2] Even Yoga doesn't implement a conforming model.[3] I'd even speculate that flexbox performs slower than the standard visual formatting model just because of the differences in the algorithm.
Transform order absolutely matters. Any attempts to coerce order into a standardized sequence means developers have to account for this information.[4]
[1]: https://github.com/Planimeter/grid-sdk/blob/master/engine/cl... [2]: https://www.w3.org/TR/css-flexbox-1/#resolve-flexible-length... [3]: https://github.com/facebook/yoga/blob/master/yoga/Yoga.cpp#L... [4]: https://docs.microsoft.com/en-us/dotnet/framework/winforms/a...