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

Relearn CSS layout

every-layout.dev

Post reply on HN
Print view View original

41–50 of 187 posts

Re: Relearn CSS layout

#41

Post by hollerith »

extrapickles wrote: post #38
codedokode wrote: post #32

Earlier quoted context omitted.

> I also find sites that do everything in rem/em more assessable as the padding also scales if they have a increased font size due to low vision. If you use Ctrl +/Ctrl - for zoom, then everything scales proportionally regardless of whether you use pixels or rems. You are trying to solve the problem that has been already solved by Opera, and later by other browsers more than 10 years ago. > Also, hardcoding things in…

Using Zoom for reading is less ideal for long term use as it generally forces you to horizontally scroll, where as increasing font size reflows the page, so only vertical scrolling is needed.

In Chrome, Ctrl +/Ctrl - reflows most text.

Like most things on the modern web, it is complicated. There seems to be a way, which I never noticed before HTML5 hit, for the web page to specify that certain text will not wrap, but rather will just run off the right edge of the viewport if the viewport is too narrow, but it is not in common use.

Re: Relearn CSS layout

#42

Post by taivare »

Theodores wrote: post #33

There is more than way to do all of these layouts. I don't have time to learn all of them, I just want my content to look great on all devices. I also want to stick to the specifications of HTML as it applies to all the browsers that do HTML5 - so no Internet Explorer. Sticking to the specs means no hacks and the likelihood that someone can make sense of my code in ten years time and not think 'why did they do this?'…

Do you have any examples as a Gist?

Re: Relearn CSS layout

#43

Post by CamperBob2 »

codedokode wrote: post #14
mixmastamyk wrote: post #9

Earlier quoted context omitted.

Win7 and IE9 are both EOL in six months. Makes sense to drop in new articles.

HTML/CSS was designed to be forward/backward compatible and not to be written only for version of Safari installed on dev's macbook. This is against the spirit of HTML.

That ship sailed the day people first started using HTML for page layout in general.

The spirit of HTML was not adequate to meet requirements, so the spirit has been upgraded. Pray all you want, it's going to be upgraded further.

Re: Relearn CSS layout

#44

Post by gary__ »

This is great.

I would prefer that browser compatability is mentioned, for my own purposes that would be IE11.

Perhaps set a baseline of what browsers are considered in the intro and then highlight deviance as it occurs.

Re: Relearn CSS layout

#46

Post by wolco »

gary__ wrote: post #36
have_faith wrote: post #24

The knowledge contained in the articles is very good but I got the feeling that it was written for an audience that already undertands the problems being solved. The Stack for instance is written in a language that only really makes sense if you've spent a lot of time with CSS and contains some extraneous paragraphs. I only mention this as the problems and solutions being explored are very valuable to learn but I thi…

Bear in mind the tutorial is prefixed "Relearn..." Though I'd class myself as a "full stack developer" css for a long time was the 2nd class citizen, with most of my time spent on learning to use front end frameworks in their idiomatic way, the "it depends" peculiarities of SQL and RDBMSs and making inroads on the vast tomb that represents architectuliary sound back ends. So an article focussed on improving my "it's…

A good full stack developer should have double the salary of a frontend/backend developer. Do you find this is the case? You need to be an expert at both roles plus have a third skill connecting them together.

Re: Relearn CSS layout

#47

Post by [deleted] »

gary__ wrote: post #44

This is great. I would prefer that browser compatability is mentioned, for my own purposes that would be IE11. Perhaps set a baseline of what browsers are considered in the intro and then highlight deviance as it occurs.

[deleted]

Re: Relearn CSS layout

#48

Post by wolco »

ww520 wrote: post #37
codedokode wrote: post #12

The code examples are overengineered. For example, the code generator for stack uses rem units and CSS variables, while it could be written without them and have better cross browser support (and the code would be easier to read and maintain in long-term perspective). The author just wants to use modern CSS features without clear rationale for this. Rem units can cause issues in long term. For example, imagine if a s…

Rem is great. It allows uniform scaling of all UI elements under a parent along with them font size.

Rem is great. px work well. Both can work and not work for different reasons. The extremes on this issue remind me of spaces vs tabs.

Re: Relearn CSS layout

#50

Post by codedokode »

ww520 wrote: post #37
codedokode wrote: post #12

The code examples are overengineered. For example, the code generator for stack uses rem units and CSS variables, while it could be written without them and have better cross browser support (and the code would be easier to read and maintain in long-term perspective). The author just wants to use modern CSS features without clear rationale for this. Rem units can cause issues in long term. For example, imagine if a s…

Rem is great. It allows uniform scaling of all UI elements under a parent along with them font size.

Where is this used? If a user wants to make everything larger then they can use zoom in a browser that works with any units (except for vx, vh, vmin, vmax that break zoom).
Post reply on HN