center tall but narrow images in product pages

there should have been a better way to do this that did not depend upon
removing "display: flex". there is even another part of the site where
we use that along with "align-items: center", and that works fine there,
but apparently not here. so i'm adding this workaround.

diff --git a/css/style.css b/css/style.css
index f726dc41939da397556d123fcd6aa58ccb37525e..ad459c81a42ead8a8948e736c12cd6f05198e640 100644 (file)
--- a/css/style.css
+++ b/css/style.css
@@ -403,13 +403,14 @@ a { transition: 0.3s; }
 .page-node-type-product .product .field--name-field-image {
   padding: 10px;
 
-  display: flex;
-  align-items: center;
-
   border: 1px solid #888;
   border-radius: 10px;
 }
 
+.page-node-type-product .product .field--name-field-image img {
+  margin: 0 auto;
+}
+
 .page-node-type-product .product .field--name-field-extra-images {
   padding: 5px;