From 76f559adafbdd5dd2b3693c0bea33912556c73ed Mon Sep 17 00:00:00 2001
From: none <none>
Date: Thu, 4 Jun 2026 23:32:54 +0200
Subject: [PATCH] Added right div

---
 index.html | 46 ++++++++++++++++++++++++++--------------------
 1 file changed, 26 insertions(+), 20 deletions(-)
diff --git a/index.html b/index.html
index 04b1d61..41f0cf3 100644
--- a/index.html
+++ b/index.html
@@ -4,26 +4,32 @@
         <title>MapTesting</title>
     </head>
     <body>
-        <img src="./ressources/Germany_location_map.svg.webp" style="height: 800px; width: 1200px;" usemap="#image-map">/>
+        <div style="height: 900px; width:200vh; display: flex; gap: 20px; background-color: green;">
+        <div style="background-color: brown; height: 900px; width: 1300px;">
+            <img src="./ressources/Germany_location_map.svg.webp" style="height: 800px; width: 1200px;" usemap="#image-map">/>
         
-        <!-- Image Map Generated by http://www.image-map.net/ -->
-        <map name="image-map">
-            <area target="" alt="SH" title="SH" onclick="alert('Schleswig-Holstein!')" coords="371,22,491,30,533,37,559,67,630,81,691,64,659,98,643,120,631,135,656,150,614,170,581,171,559,137,510,152,460,126,410,118,373,76" shape="poly">
-            <area target="" alt="MP" title="MP" onclick="alert('Mecklenburg-Vorpommern!')" coords="646,121,946,51,1046,121,1061,176,995,157,933,188,825,181,779,176,699,201,661,177,616,176,658,149,636,134" shape="poly">
-            <area target="" alt="BB" title="BB" onclick="alert('Brandenburg!')" coords="716,201,809,181,899,198,1001,162,1046,171,1035,183,1071,180,1043,214,1038,229,1096,254,1086,271,1090,284,1103,288,1104,304,1100,323,1090,331,1109,349,1058,363,1035,364,1020,377,950,371,924,373,914,352,915,330,855,314,808,297,814,263,799,261,805,240,805,226,763,219,736,210" shape="poly">
-            <area target="" alt="S" title="S" onclick="alert('Sachsen!')" coords="908,354,926,375,1011,380,1054,364,1110,360,1136,375,1144,392,1119,434,1103,419,1080,411,1055,409,1048,413,1066,423,1044,425,1003,439,948,449,883,469,831,481,815,489,773,474,804,456,816,445,814,434,853,423,835,410,810,406,800,384,808,362,865,353" shape="poly">
-            <area target="" alt="B" title="B" onclick="alert('Bayern!')" coords="773,480,841,526,824,543,873,581,926,602,959,623,993,634,991,661,955,659,931,686,876,698,873,712,893,741,875,752,814,744,734,762,661,779,649,763,594,761,568,787,536,763,516,761,555,749,550,674,580,665,603,648,596,625,578,603,560,583,554,561,541,567,520,549,515,542,458,540,468,550,434,562,439,536,426,512,458,502,480,506,495,496,520,477,560,462,578,458,560,462,631,494,641,490,633,483,670,481,688,489,700,467,723,478,756,475" shape="poly">
-            <area target="" alt="BW" title="BW" onclick="alert('Baden-W&uuml;rtemberg!')" coords="368,562,334,620,276,668,255,719,249,759,285,758,324,756,349,753,374,740,393,743,455,751,494,757,528,749,549,730,541,679,576,657,588,621,545,571,488,544,425,570,398,578,389,565" shape="poly">
-            <area target="" alt="Saar" title="Saar" onclick="alert('Saarland!')" coords="105,563,186,554,218,563,218,581,219,600,160,596,145,598" shape="poly">
-            <area target="" alt="Hamburg" title="Hamburg" onclick="alert('Hamburg')" coords="516,152,559,141,573,169,533,168" shape="poly">
-            <area target="" alt="Bremen" title="Bremen" onclick="alert('Bremen')" coords="359,190,384,203,411,210,415,198" shape="poly">
-            <area target="" alt="RP" title="RP" onclick="alert('Rheinland-Pfalz!')" coords="113,555,186,548,226,564,231,600,325,618,356,572,343,545,331,515,288,517,276,507,308,491,294,472,311,454,279,426,249,446,189,456,160,477,123,479,104,483,78,502,99,530,120,534" shape="poly">
-            <area target="" alt="Hannover" title="Hannover" onclick="alert('Hannover!')" coords="450,128,375,124,363,172,343,154,339,169,311,164,300,141,209,146,185,174,215,179,189,248,155,250,154,264,180,264,190,288,249,277,255,262,276,276,294,274,294,286,294,299,296,308,355,296,350,275,334,266,378,260,388,271,418,270,433,263,421,285,439,304,475,330,473,349,504,353,491,378,511,383,511,377,551,371,590,355,620,352,614,319,626,305,654,301,660,267,631,227,700,222,723,209,640,181,589,176,534,173" shape="poly">
-            <area target="" alt="NRW" title="NRW" onclick="alert('Nordrhein-Westfalen!')" coords="193,291,268,277,293,304,301,311,364,302,356,266,376,269,400,278,419,277,425,299,450,319,470,338,466,351,441,367,419,366,380,385,373,394,390,394,384,404,365,404,349,426,329,432,280,420,245,446,188,453,156,470,110,477,63,437,46,410,79,397,91,376,76,352,63,338,71,328,111,334,161,318,149,306,174,297" shape="poly">
-            <area target="" alt="SA" title="SA" onclick="alert('Sachsen-Anhalt!')" coords="731,214,643,231,663,267,669,295,628,310,624,348,659,354,666,373,709,376,715,398,765,413,796,416,798,387,803,366,811,355,859,351,911,351,908,332,805,304,806,271,791,264,800,230" shape="poly">
-            <area target="" alt="Hessen" title="Hessen" onclick="alert('Hessen!')" coords="486,354,471,353,439,371,416,371,380,388,398,396,381,406,366,406,354,423,334,434,306,465,310,489,284,508,294,515,329,513,354,542,358,560,388,562,399,573,433,557,435,534,418,511,453,499,481,504,541,467,546,451,524,451,543,424,548,413,563,413,555,404,563,397,539,385,524,375,513,383,485,378,496,358" shape="poly">
-            <area target="" alt="Thüringen" title="Thüringen" onclick="alert('Th&uuml;ringen!')" coords="535,376,573,394,535,448,558,449,545,463,566,459,613,489,634,491,629,480,670,478,684,485,699,463,724,473,769,471,808,449,808,437,844,420,820,411,798,419,706,398,703,381,670,377,656,355,619,355,583,360,563,372" shape="poly">
-        </map>
-
+            <!-- Image Map Generated by http://www.image-map.net/ -->
+            <map name="image-map">
+                <area target="" alt="SH" title="SH" onclick="alert('Schleswig-Holstein!')" coords="371,22,491,30,533,37,559,67,630,81,691,64,659,98,643,120,631,135,656,150,614,170,581,171,559,137,510,152,460,126,410,118,373,76" shape="poly">
+                <area target="" alt="MP" title="MP" onclick="alert('Mecklenburg-Vorpommern!')" coords="646,121,946,51,1046,121,1061,176,995,157,933,188,825,181,779,176,699,201,661,177,616,176,658,149,636,134" shape="poly">
+                <area target="" alt="BB" title="BB" onclick="alert('Brandenburg!')" coords="716,201,809,181,899,198,1001,162,1046,171,1035,183,1071,180,1043,214,1038,229,1096,254,1086,271,1090,284,1103,288,1104,304,1100,323,1090,331,1109,349,1058,363,1035,364,1020,377,950,371,924,373,914,352,915,330,855,314,808,297,814,263,799,261,805,240,805,226,763,219,736,210" shape="poly">
+                <area target="" alt="S" title="S" onclick="alert('Sachsen!')" coords="908,354,926,375,1011,380,1054,364,1110,360,1136,375,1144,392,1119,434,1103,419,1080,411,1055,409,1048,413,1066,423,1044,425,1003,439,948,449,883,469,831,481,815,489,773,474,804,456,816,445,814,434,853,423,835,410,810,406,800,384,808,362,865,353" shape="poly">
+                <area target="" alt="B" title="B" onclick="alert('Bayern!')" coords="773,480,841,526,824,543,873,581,926,602,959,623,993,634,991,661,955,659,931,686,876,698,873,712,893,741,875,752,814,744,734,762,661,779,649,763,594,761,568,787,536,763,516,761,555,749,550,674,580,665,603,648,596,625,578,603,560,583,554,561,541,567,520,549,515,542,458,540,468,550,434,562,439,536,426,512,458,502,480,506,495,496,520,477,560,462,578,458,560,462,631,494,641,490,633,483,670,481,688,489,700,467,723,478,756,475" shape="poly">
+                <area target="" alt="BW" title="BW" onclick="alert('Baden-W&uuml;rtemberg!')" coords="368,562,334,620,276,668,255,719,249,759,285,758,324,756,349,753,374,740,393,743,455,751,494,757,528,749,549,730,541,679,576,657,588,621,545,571,488,544,425,570,398,578,389,565" shape="poly">
+                <area target="" alt="Saar" title="Saar" onclick="alert('Saarland!')" coords="105,563,186,554,218,563,218,581,219,600,160,596,145,598" shape="poly">
+                <area target="" alt="Hamburg" title="Hamburg" onclick="alert('Hamburg')" coords="516,152,559,141,573,169,533,168" shape="poly">
+                <area target="" alt="Bremen" title="Bremen" onclick="alert('Bremen')" coords="359,190,384,203,411,210,415,198" shape="poly">
+                <area target="" alt="RP" title="RP" onclick="alert('Rheinland-Pfalz!')" coords="113,555,186,548,226,564,231,600,325,618,356,572,343,545,331,515,288,517,276,507,308,491,294,472,311,454,279,426,249,446,189,456,160,477,123,479,104,483,78,502,99,530,120,534" shape="poly">
+                <area target="" alt="Hannover" title="Hannover" onclick="alert('Hannover!')" coords="450,128,375,124,363,172,343,154,339,169,311,164,300,141,209,146,185,174,215,179,189,248,155,250,154,264,180,264,190,288,249,277,255,262,276,276,294,274,294,286,294,299,296,308,355,296,350,275,334,266,378,260,388,271,418,270,433,263,421,285,439,304,475,330,473,349,504,353,491,378,511,383,511,377,551,371,590,355,620,352,614,319,626,305,654,301,660,267,631,227,700,222,723,209,640,181,589,176,534,173" shape="poly">
+                <area target="" alt="NRW" title="NRW" onclick="alert('Nordrhein-Westfalen!')" coords="193,291,268,277,293,304,301,311,364,302,356,266,376,269,400,278,419,277,425,299,450,319,470,338,466,351,441,367,419,366,380,385,373,394,390,394,384,404,365,404,349,426,329,432,280,420,245,446,188,453,156,470,110,477,63,437,46,410,79,397,91,376,76,352,63,338,71,328,111,334,161,318,149,306,174,297" shape="poly">
+                <area target="" alt="SA" title="SA" onclick="alert('Sachsen-Anhalt!')" coords="731,214,643,231,663,267,669,295,628,310,624,348,659,354,666,373,709,376,715,398,765,413,796,416,798,387,803,366,811,355,859,351,911,351,908,332,805,304,806,271,791,264,800,230" shape="poly">
+                <area target="" alt="Hessen" title="Hessen" onclick="alert('Hessen!')" coords="486,354,471,353,439,371,416,371,380,388,398,396,381,406,366,406,354,423,334,434,306,465,310,489,284,508,294,515,329,513,354,542,358,560,388,562,399,573,433,557,435,534,418,511,453,499,481,504,541,467,546,451,524,451,543,424,548,413,563,413,555,404,563,397,539,385,524,375,513,383,485,378,496,358" shape="poly">
+                <area target="" alt="Thüringen" title="Thüringen" onclick="alert('Th&uuml;ringen!')" coords="535,376,573,394,535,448,558,449,545,463,566,459,613,489,634,491,629,480,670,478,684,485,699,463,724,473,769,471,808,449,808,437,844,420,820,411,798,419,706,398,703,381,670,377,656,355,619,355,583,360,563,372" shape="poly">
+            </map>
+        </div>
+        <div style="background-color: blue; display: flex; height: 900px; width: 100vh; margin-top: 20px;">
+            <h1 style="color: white;">WOW</h1>
+        </div>
+        </div>
     </body>
 </html>
\ No newline at end of file
