Je trouve que les articles de developer.mozilla.org sont souvent très bien rédiges, par exemple si tu veux regarder le modèle des flexbox qui est plus facile à manipuler que ce que tu as connu en 2001 :
Les concepts de base pour flexbox - CSS : Feuilles de style en cascade | MDNdeveloper.mozilla.orgLe module des boîtes flexibles, aussi appelé « flexbox », a été conçu comme un modèle de disposition unidimensionnel et comme une méthode permettant de distribuer l'espace entre des objets d'une interface ainsi que de les aligner. Dans cet article, nous verrons les fonctionnalités principales des flexbox que nous approfondirons ensuite dans d'autres articles. (ça date du moment où je m'occupais beaucoup de yaronet donc il y a peut-être mieux depuis). Ou bien sinon le modèle de grids (display: grid) qui d'après ce que tu décris pourrait correspondre à ta façon de visualiser une page Web.
Pour que le rendu s'adapte selon la largeur de l'affichage, regarde ce que tu trouves sur les "media queries" qui permettent de définir des règles CSS qui ne se déclenchent que sous certaines conditions, par exemple "la largeur de l'écran est inférieure à x", ou "le dispositif de pointage est grossier" (= c'est un écran touch sans souris).