Use CSS to centre the images in the key

diff --git a/app/assets/stylesheets/common.css.scss b/app/assets/stylesheets/common.css.scss
index e309e2ed720c5db869f8fd9c0cfcd77eedfbf279..43eea9ee0c359764a7aabc31cf6cb4d028b20203 100644 (file)
--- a/app/assets/stylesheets/common.css.scss
+++ b/app/assets/stylesheets/common.css.scss
@@ -497,7 +497,10 @@ h2 {
   padding-right: 5px;
 }
 
-#mapkey .mapkey-table-key {
+#mapkey .mapkey-table-key img {
+  display: block;
+  margin-left: auto;
+  margin-right: auto;
 }
 
 #mapkey .mapkey-table-value {

diff --git a/app/views/site/key.html.erb b/app/views/site/key.html.erb
index 294224b189612ccefb5cefa335d3cbc112ef6fc3..ed36c0186ccdf96e59334e0a30fa76f9a110ac6c 100644 (file)
--- a/app/views/site/key.html.erb
+++ b/app/views/site/key.html.erb
@@ -5,7 +5,7 @@
         <% data.each do |entry| %>
           <% if params[:zoom].to_i >= entry['min_zoom'] && params[:zoom].to_i <= entry['max_zoom'] %>
             <tr>
-              <td class="mapkey-table-key" align="center">
+              <td class="mapkey-table-key">
                 <%= image_tag "key/#{name}/#{entry['image']}" %>
               </td>
               <td class="mapkey-table-value">