fu: Close-up of Fu, bringing a scoop of water to her mouth (Default)
fu ([personal profile] fu) wrote in [site community profile] changelog2012-02-22 05:49 pm

[dw-free] Cleanup tables on site-styled /icons

[commit: http://hg.dwscoalition.org/dw-free/rev/08ff47c199f2]

http://bugs.dwscoalition.org/show_bug.cgi?id=4312

Tweaks vertical alignment between text and the image for smaller icons. Also
increases whitespace between icons to better distinguish between them. Lots
of input from [personal profile] ninetydegrees on this one -- thank you!

Patch by [personal profile] fu.

Files modified:
  • htdocs/stc/allpics.css
--------------------------------------------------------------------------------
diff -r a3cbd9634981 -r 08ff47c199f2 htdocs/stc/allpics.css
--- a/htdocs/stc/allpics.css	Wed Feb 22 20:03:20 2012 +0800
+++ b/htdocs/stc/allpics.css	Thu Feb 23 01:49:45 2012 +0800
@@ -11,25 +11,25 @@
 }
 
 .icon-image {
-    float: left;
-    width: 100px;
+    display: table-cell;
     height: 100px;
-    line-height: 100px;
+    min-width: 100px;
+    padding: 0.5em;
     text-align: center;
-    padding: 0.2em 0.5em;
+    vertical-align: bottom;
     }
 
 .icon-image img {
-    
+    vertical-align: bottom;
     }
 
 .icon-info {
-    padding: 0.2em 0.5em;
+    display: table-cell;
+    padding: 0.5em;
     overflow:auto;
     vertical-align: bottom;
+    width:100%;
     word-wrap: break-word;
-    display: table-cell;
-    width:100%;
     }
 
 .icon {
--------------------------------------------------------------------------------