galerie | vystredeni nahledu

galerie/templates/galerie/GalerieNahled.html

@@ -37,7 +37,7 @@
   <div class="galerie_nahledy">
     {% for obrazek in obrazky %}
         <div class="galerie_nahled">
-          <div class="vystredeno">
+          <span class="vystredeno"></span>
           <a title="Zobrazit tuto fotografii" href="./{{obrazek.pk}}#popis">
           <img
             src="{{obrazek.obrazek_maly.url}}"
@@ -45,7 +45,6 @@
             height={% widthratio obrazek.obrazek_maly.height 200 167 %} />
           </a>
         </div>
-        </div>
     {% endfor %}
     <br>
   </div>

mamweb/static/css/mamweb.css

@@ -467,13 +467,20 @@ div.zadani_azad_termin {
   background-repeat: no-repeat;
 }
 
-/*.galerie{
+.galerie{
   position: relative;
-}*/
+  text-align: center;
+}
+
+.popis{
+  text-align: center;
+  margin: 10px;
+}
 
 .galerie_nahledy{
   /*margin: 1em 0;*/
   margin: 0 auto 0 auto;
+  text-align: center;
 }
 
 .galerie_nahledy a{
@@ -481,11 +488,10 @@ div.zadani_azad_termin {
   width: 100%;
 }
 
-.galerie_nahled{
+.galerie_nahled{ /* frame */
   float: left;
   width: 190px;
   height: 190px;
-  vertical-align: middle;
   text-align: center;
   border: solid;
   border-width: 4px;
@@ -493,10 +499,20 @@ div.zadani_azad_termin {
   border-color: #ffa500;
   background-color: #ffa500;
   margin: 10px;
+  white-space: nowrap;
+}
+
+.vystredeno{ /* helper */
+  display: inline-block;
+  height: 100%;
+  vertical-align: middle;
 }
 
 .galerie_nahled img{
   border-radius: 2px;
+  vertical-align: middle;
+  max-height: 180px;
+  max-width: 180px;
 }