47 lines
1.6 KiB
Org Mode
47 lines
1.6 KiB
Org Mode
:PROPERTIES:
|
|
:ID: 7431e4a3-4359-4dcb-89e6-c1c700cd4355
|
|
:END:
|
|
#+Title: HTML/CSS Web techs
|
|
#+Author: Yann Esposito
|
|
#+Date: [2022-10-05]
|
|
|
|
- tags :: [[id:a5be1daf-1010-428f-a30f-8faf95c1a42f][blog]]
|
|
- source ::
|
|
|
|
* CSS limitations
|
|
|
|
After a lot of trial, search, etc… I came to the conclusion it is not possible
|
|
to solve this layout problem with CSS only without modifying the attached HTML.
|
|
|
|
Given a container div, and multiple children.
|
|
The first few children could have a dynamic height.
|
|
I want the last one to take the remaining space and fill it.
|
|
|
|
So the HTML is restricted to be:
|
|
|
|
#+begin_src html
|
|
<div class="container">
|
|
<div>1</div>
|
|
<div>2</div>
|
|
<div class="filler">Should take the rest of the space</div>
|
|
</div>
|
|
#+end_src
|
|
|
|
So we set the height of ~container~ to be something also dynamic like ~100vh~ for example.
|
|
I expected this to be solvable via ~flex~ or ~grid~. But apparently, no, this is not
|
|
solvable this way...
|
|
|
|
So here goes another limitation of HTML.
|
|
* Deeper discussion
|
|
|
|
There are too many things to care about when building web technologies.
|
|
And also, the change must be done via consensus between different browser builders.
|
|
As such we currently only have terrible choices.
|
|
If you compare this with the so great concepts used by TeX, this is such a
|
|
shame.
|
|
But imagine, you have to deal with forms, drawing, but also, accessibility
|
|
features.
|
|
Website with textual content, as well as with animated content, etc…
|
|
|
|
So what we end up with is this terrible set of technologies for which you can
|
|
only do a few things but are never generalized enough to be great in every dimensions.
|