Centered image on media page

mediagoblin/static/css/base.css

@@ -138,3 +138,11 @@ a.mediagoblin_logo:hover {
   margin-top:8px;
   margin-bottom:8px;
 }
+
+/* media pages */
+
+img.media_image {
+  display:block;
+  margin-left:auto;
+  margin-right:auto;
+}

mediagoblin/templates/mediagoblin/user_pages/media.html

@@ -20,18 +20,17 @@
 
   {# temporarily, an "image gallery" that isn't one really ;) #}
   {% if media %}
-  <h1>
+    <img class="media_image" src="{{ request.app.public_store.file_url(
-    Media details for
-    <a href="{{ request.urlgen(
-                  'mediagoblin.user_pages.user_home',
-                  user=media.uploader().username) }}">
-      {{- media.uploader().username }}</a>
-    / {{media.title}}
-  </h1>
-  <div>
-    <img src="{{ request.app.public_store.file_url(
                   media.media_files.main) }}" />
     <br />
+    <h1>
+      Media details for
+      <a href="{{ request.urlgen(
+                   'mediagoblin.user_pages.user_home',
+                    user=media.uploader().username) }}">
+        {{- media.uploader().username }}</a>
+      / {{media.title}}
+    </h1>
     Uploaded on
     {{ "%4d-%02d-%02d"|format(media.created.year,
                               media.created.month, media.created.day) }}
@@ -41,7 +40,6 @@
       {{- media.uploader().username }}</a>
     <br />
     Description: {{ media.description }}
-  </div>
   {% else %}
   <p>Sorry, no such media found.<p/>
   {% endif %}