: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.