Bilder hoffentlich 'responsive'

Author: mk1012

archiv.html

@@ -24,6 +24,8 @@
 
     <!-- Custom CSS -->
     <link href="css/coderdojoka.css" rel="stylesheet">
+    <link href="css/puzzle.css" rel="stylesheet">
+
 
     <!-- Custom Fonts -->
     <link href="font-awesome/css/font-awesome.min.css" rel="stylesheet" type="text/css">

css/coderdojoka.css

@@ -746,12 +746,4 @@ body {
     border-left: 30px solid black;
     border-bottom: 20px solid transparent;
     margin-right: 10px;
-}
-
-#old_puzzles {
-    text-align: left;
-}
-
-hr {
-    margin: 100px 0;
 }

css/puzzle.css

@@ -0,0 +1,15 @@
+/*
+Damit die Bilder, auch automatisch generierte  'responsive' sind.
+*/
+img {
+    max-width: 100%;
+    height: auto;
+}
+
+#old_puzzles {
+    text-align: left;
+}
+
+hr {
+    margin: 100px 0;
+}

index.html

@@ -145,7 +145,7 @@
                     <tr>
                         <td>
                             <div class="triangle_box">
-                                <div class="triangle_text">Neu</div>
+                                <div class="triangle_text">neu</div>
                                 <div class="triangle_right"></div>
                             </div>
                         </td>
@@ -194,7 +194,7 @@ <h2>Warum CoderDojo?</h2>
                     programmieren zu lernen und sie in diesem Bereich zu fördern. </p>
                 <a href="img/codo/bild_1.jpg" data-lightbox="codo-bilder"
                    data-title="Mit zweiter Tastatur gehts besser!">
-                    <img class="img-thumbnail rechts_400" src="img/codo/bild_1.jpg" alt=""/>
+                    <img class="img-thumbnail img-responsive rechts_400" src="img/codo/bild_1.jpg" alt=""/>
                 </a>
 
                 <h2>Wie funktioniert's?</h2>

raetsel.html

@@ -24,6 +24,8 @@
 
     <!-- Custom CSS -->
     <link href="css/coderdojoka.css" rel="stylesheet">
+    <link href="css/puzzle.css" rel="stylesheet">
+
 
     <!-- Custom Fonts -->
     <link href="font-awesome/css/font-awesome.min.css" rel="stylesheet" type="text/css">