SQL erweitert und Bruno hinzugefügt

2026-07-06 11:32:17 +02:00
parent 488426b1aa
commit eec5516e14
10 changed files with 426 additions and 0 deletions
@@ -0,0 +1,161 @@
+# PHP & CSS – Tabellen und Formulare
+
+## 1. Input-Feld mit vorausgefülltem Wert
+
+**Problem:** `$value=` ist kein gültiges HTML-Attribut.
+
+**Lösung:**
+```html
+<input name="ls" value="<?= htmlspecialchars($row['ls']) ?>">
+```
+
+Doppelte Anführungszeichen außen verwenden, damit die einfachen Anführungszeichen im PHP-Array (`$row['ls']`) nicht kollidieren.
+
+Weiterer Fehler im Original: doppeltes `</td></td>` und fehlendes schließendes `</td>`.
+
+**Korrekter Block:**
+```html
+<form method="post">
+    <table>
+        <tr>
+            <th>Ticket-Nr.</th>
+            <td><?= htmlspecialchars($row['tt']) ?></td>
+        </tr>
+        <tr>
+            <th>Auftraggeber</th>
+            <td><input name="ls" value="<?= htmlspecialchars($row['ls']) ?>"></td>
+            <th>Bearbeiter</th>
+            <td><?= htmlspecialchars($row['bearbeiter']) ?></td>
+        </tr>
+    </table>
+</form>
+```
+
+---
+
+## 2. Spaltenbreite in Tabellen
+
+### Option 1 – Inline Style
+```html
+<th style="width: 150px;">Auftraggeber</th>
+```
+
+### Option 2 – CSS-Klasse
+```css
+table th { width: 150px; }
+table th:first-child { width: 100px; }
+```
+
+### Option 3 – `<col>`-Element (zentral für jede Spalte)
+```html
+<table>
+    <colgroup>
+        <col style="width: 150px;">
+        <col style="width: 250px;">
+        <col style="width: 150px;">
+        <col style="width: 250px;">
+    </colgroup>
+    ...
+</table>
+```
+
+> **Wichtig:** `table-layout: fixed` ist erforderlich, damit die Breiten zuverlässig greifen.
+
+```css
+table {
+    table-layout: fixed;
+    width: 100%;
+}
+```
+
+---
+
+## 3. Spaltenbreiten zentral für mehrere Tabellen
+
+Jeder Tabelle eine eigene Klasse geben:
+
+```html
+<table class="tabelle-ticket">
+<table class="tabelle-adressen">
+```
+
+CSS in einer zentralen `.css`-Datei:
+
+```css
+table {
+    table-layout: fixed;
+    width: 100%;
+}
+
+.tabelle-ticket col:nth-child(1) { width: 150px; }
+.tabelle-ticket col:nth-child(2) { width: 250px; }
+.tabelle-ticket col:nth-child(3) { width: 150px; }
+.tabelle-ticket col:nth-child(4) { width: 250px; }
+
+.tabelle-adressen col:nth-child(1) { width: 100px; }
+.tabelle-adressen col:nth-child(2) { width: 300px; }
+```
+
+Einbinden per:
+```html
+<link rel="stylesheet" href="style.css">
+```
+
+---
+
+## 4. Tabelle ignoriert Spaltenbreiten (Auto-Breite)
+
+**Ursache:** Fehlendes `table-layout: fixed`.
+
+```css
+table {
+    width: 100%;
+    border-collapse: collapse;
+    table-layout: fixed;  /* ← das fehlte */
+}
+```
+
+Außerdem: `max-width: auto` ist ungültig. Entweder weglassen oder konkreten Wert setzen:
+```css
+.content {
+    max-width: 1200px;  /* oder weglassen */
+}
+```
+
+---
+
+## 5. Input-Breite sprengt Tabellenlayout
+
+**Ursache:** `input { width: 100%; }` greift auch auf Inputs in Tabellenzellen.
+
+**Lösung:** Inputs in Tabellen explizit ausschließen:
+
+```css
+/* Inputs nur im Formular-Bereich */
+.form-bereich input,
+.form-bereich select {
+    width: 100%;
+    padding: 8px;
+    margin-top: 4px;
+}
+
+/* Inputs in Tabellen zurücksetzen */
+td input, td select {
+    width: auto;
+    padding: 2px 4px;
+    margin-top: 0;
+}
+```
+
+Oder Formular-Bereich per Klasse kapseln:
+
+```html
+<div class="form-bereich">
+    <label>...</label>
+    <input ...>
+</div>
+
+<table>
+    ...  <!-- inputs hier bleiben unberührt -->
+</table>
+```