diff --git a/view/message-board.html b/view/message-board.html index 9078c4e..8fe9b5b 100644 --- a/view/message-board.html +++ b/view/message-board.html @@ -5,6 +5,9 @@ Message Board + + + diff --git a/view/styles.css b/view/styles.css index d6bc130..faa0142 100644 --- a/view/styles.css +++ b/view/styles.css @@ -19,7 +19,7 @@ body { box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); display: flex; flex-direction: column; - align-items: center; /* Zentriert die Links im Container */ + align-items: center; /* Zentriert die Inhalte im Container */ } h1 { @@ -76,17 +76,26 @@ h1 { form { display: flex; flex-direction: column; + align-items: center; /* Zentriert die Form-Inhalte horizontal */ gap: 10px; + width: 100%; /* Maximale Breite der Form */ } form input, form textarea { - width: 100%; + width: 90%; /* Eingabefelder nehmen 90% der Breite ein */ padding: 10px; border: 1px solid #ccc; border-radius: 5px; + box-sizing: border-box; /* Verhindert, dass Padding die Größe beeinflusst */ +} + +form textarea { + height: 100px; /* Größeres Textfeld */ + resize: none; /* Deaktiviert Größenänderungen durch den Benutzer */ } form button { + width: 50%; /* Sende-Knopf nimmt 50% der Form-Breite ein */ padding: 10px; background: #007BFF; color: white; @@ -99,4 +108,3 @@ form button { form button:hover { background: #0056b3; } -