diff --git a/index.html b/index.html index 7ccc65209314b8fea355973d1024f91113abd716..8a0a4c766e35ccd55835412b788cac922a61d466 100644 --- a/index.html +++ b/index.html @@ -10,7 +10,7 @@ <div class="container"> <div class="karte-container"> - <img src="Karte.png" alt="Übersichtskarte Deutschland mit den eingetragenen Standorten" class="karte"> + <img src="Karte.png" alt="Übersichtskarte Deutschland mit den eingetragenen Standorten" width="1000" height="2024" > <div class="markierung" data-befund="1" style="left:520px; top:315px;"></div> @@ -55,7 +55,7 @@ </tr> <tr data-befund="2"> - <td></td> + <td>TESTTEST</td> <td>Beispiel Osnabrück</td> <td>Dominikus Böhm</td> <td>JAHR</td> diff --git a/style.css b/style.css index 566ab5f37e8b3bd4e50d6717f14f4271419bf54d..c2597cceb163c8742b7bf3c993988ee3d8f6b4ca 100644 --- a/style.css +++ b/style.css @@ -1,11 +1,10 @@ - .ausgewaehlt { background-color: #00eaff; /* Beispiel für Hervorhebung */ border: 2px solid rgb(0, 234, 255); /* Beispiel für Rahmen um die Markierung */ } /* Stil für die Isometrie und die Markierungen */ -.isometrie { +.karte { position: relative; width: 100%; height: 500px; /* Passe die Höhe an deine Isometrie an */ @@ -44,24 +43,19 @@ table th, table td { table th:last-child, table td:last-child { border-right: none; /* Keine Trennlinie für die letzte Spalte */ } - -/* Gemeinsame Stile */ .container { - display: flex; - flex-wrap: wrap; /* Ermöglicht das Umschlagen der Elemente auf kleine Bildschirme */ - width: 100%; /* Volle Breite des Containers */ + display: flex; /* Flexbox verwenden */ } - -/* Stil für das Bild */ .karte-container { - flex: 1; /* Flexbox: Das Bild nimmt den verfügbaren Platz ein */ - max-width: 50%; /* Maximale Breite des Bildcontainers */ - background-color: #f0f0f0; /* Hintergrundfarbe für das Bild */ - padding: 20px; /* Innenabstand des Containers */ - box-sizing: border-box; /* Box-Modell auf border-box einstellen */ + width: 1000px; /* Anpassen an die Breite des alten Bildes */ + height: 2024px; /* Anpassen an die Höhe des alten Bildes */ + padding: 20px; + overflow= hidden; + flex= 1; + border-right: 1px solid #ccc; } -.karte-container img { - width: 100%; /* Volle Breite des Bildcontainers */ - height: auto; /* Automatische Höhe für das Bild */ +.tabelle-container { + flex: 1; /* Flexbox: Aufteilung des verfügbaren Platzes */ + padding: 20px; /* Abstand um die Tabelle */ }