layout

src/whoaremyfriends/wersindmeinefreunde.html

@@ -3626,6 +3626,8 @@
   So kriege ich meine Übersetzungs-Tabelle.
 </div>
 
+
+
 <!-- TODO
 <div class="para">
   Auch viele Tiere haben diese Vier Typen:
@@ -3642,14 +3644,9 @@
 
 
 
-<hr>
-
-
-
 <div class="para">
   Vier Typen in verschiedenen
-
-  <div class="annotation" onClick="clickAnnotation(this)" title='
+  <div content="Namespaces." class="annotation" onClick="clickAnnotation(this)" title='
 
     TODO layout: keep table on one page
 
@@ -3707,8 +3704,7 @@
     </tr>
 
   '>Namespaces.</div>
-
-  Längere Beschreibungen stehen auf den folgenden Seiten.
+  Längere Beschreibungen stehen auf den nächsten Seiten.
 </div>
 
 <table class="four-basetypes nowrap" style="margin-top:1em; margin-bottom:1em">
@@ -4003,6 +3999,28 @@
       <td>helfen</td>
       <td>fordern</td>
     </tr>
+  </tbody>
+</table>
+
+
+
+<!-- split table for better layout -->
+
+
+
+<!-- dont break table -->
+<hr>
+
+
+<table class="four-basetypes nowrap" style="margin-top:1em; margin-bottom:1em">
+  <tbody>
+    <tr>
+      <th>Typ Nummer</th>
+      <td>1</td>
+      <td>2</td>
+      <td>3</td>
+      <td>4</td>
+    </tr>
     <tr>
       <th><a class="nofootnote" href="https://en.wikipedia.org/wiki/Somatotype">William Sheldon</a></th>
       <td>mesomorph</td>
@@ -4132,6 +4150,8 @@
   </tbody>
 </table>
 
+
+
 <div class="para">
   Mehr Namespaces in meinen
   <a href="https://milahu.github.io/alchi/tables">alchi-tables</a>.
@@ -4139,10 +4159,6 @@
 
 
 
-<hr>
-
-
-
 <div class="para">
   <b>Wer ist wer?</b>
   Also: Wer hat welchen Persönlichkeitstyp?
@@ -4336,10 +4352,6 @@
 
 
 
-<hr>
-
-
-
 <div class="para">
   Auch über die Körperform kann man Typen schätzen
   (Physiognomie, Morpho-Psychologie, Profiling,
@@ -4412,6 +4424,12 @@
   Also der Stress braucht genauen Anfang und Ende.
 </div>
 
+
+
+<hr>
+
+
+
 <div class="para">
   Beispiel: <b>The Strange Situation</b>:
   Mutter verlässt Kind (Anfang vom Stress),
@@ -4456,14 +4474,7 @@
   wie tiere: torso liegt horizontal beim laufen auf 4 beinen.
 </div>
 
-
-
-<hr>
-
-
-
 <div class="para">
-  The Strange Situation:
   Diese typische Stress-Reaktion sieht man auch bei Erwachsenen,
   aber das kindische Schreien wird ersetzt durch andere Stress-Reaktionen,
   und der Subtyp verschiebt das Verhalten
@@ -4539,6 +4550,10 @@
 
 
 
+<hr>
+
+
+
 <div class="para">
   <b>Zahlen:</b>
   Für mich sind die Zahlen wichtig,
@@ -4694,6 +4709,12 @@
   Kontrast zwischen Natur und Kunst.
 </div>
 
+
+
+<hr>
+
+
+
 <div class="para">
   Man kann auch "falsche" Farben tragen,
   aber das wirkt "geschmacklos" (bad taste)
@@ -4813,10 +4834,6 @@
 
 
 
-<hr>
-
-
-
 <div class="para">
   Warum ist Farbe X oben?
   Warum ist Farbe Y unten?
@@ -4910,10 +4927,6 @@
 
 
 
-<hr>
-
-
-
 <div class="para">
   Das Schließen von Körperform auf Innere Werte
   ist bekannt als <b>Physiognomie</b> oder Morpho-Psychologie.
@@ -5004,22 +5017,19 @@
   schneller Stoffwechsel (high metabolic rate),
 </div>
 
+
+
+<!-- TODO more -->
+
 <div class="para">
   Typen 12:
-  gerade Finger
-</div>
-
-<div class="para">
+  gerade Finger.
   Typen 34:
-  spitze Finger,
+  spitze Finger.
 </div>
 
 
 
-<hr>
-
-
-
 <div class="para">
   <b>Diät</b>
   wird oft falsch verstanden als "weniger essen",
@@ -7268,6 +7278,10 @@
 
 
 
+<hr>
+
+
+
 <div class="para">
   Grundtypen in Fünf Werte Skalen.
   <div class="annotation" onClick="clickAnnotation(this)" title='
@@ -7640,6 +7654,10 @@
 
 
 
+<hr>
+
+
+
 <div class="para">
   Subtypen in Fünf Werte Skalen.
   Beispiel:
@@ -8036,10 +8054,6 @@
 
 
 
-<hr>
-
-
-
 <div class="para">
   Pallas-Muster, Ausschnitt: M103S und M204L:
 </div>
@@ -8322,6 +8336,8 @@
   </svg>
 </div>
 
+
+
 <div class="para">
   Subtypen in Fünf Werte Skalen.
   Beispiel: Typen 104 302.
@@ -8816,6 +8832,8 @@
   </svg>
 </div>
 
+
+
 <div class="para">
   Subtypen in Fünf Werte Skalen.
   Beispiel: Typen 103 402.
@@ -9714,6 +9732,8 @@
   (realistischer Freiraum, privates Umfeld, Inner Circle).
 </div>
 
+
+
 <div class="para">
   <b>Mathematik:</b> Vier Operationen.
   Die vier Operationen (Plus Minus Mal Durch)
@@ -10206,12 +10226,6 @@
   Die acht Finger haben die Zahlenwerte 1234 und 6789.
 </div>
 
-
-
-<!-- TODO avoid fored pagebreak. needed to avoid splitting table -->
-
-<hr>
-
 <table title="Mathematik: Multiplikation Division Addition Subtraktion" style="margin:auto; margin-top:0.5em; border:solid 1px black">
   <tr>
     <td>1. Multiplikation</td>
@@ -10248,6 +10262,8 @@
   </tr>
 </table>
 
+
+
 <div class="para">
   Konzept: <b>Sozialdarwinismus:</b>