Simplify .update-img layout

Fixes #424.

Using a float rather than table-cell styling also means we
no longer have to work around IE7 table display support.

1 files changed, 5 insertions, 32 deletions

diff --git a/web/cobrands/sass/_base.scss b/web/cobrands/sass/_base.scss
index 8e2a65d1b..b4c4d18da 100644
--- a/web/cobrands/sass/_base.scss
+++ b/web/cobrands/sass/_base.scss
@@ -822,35 +822,14 @@ a:hover.button-left {
     padding: 0.5em 1em;
     display:block;
     .update-wrap {
-      display:table;
-      width:100%;
-      .update-text,
-      .update-img {
-        display:table-cell;
-        vertical-align:top;
-        p {
-          margin-bottom: 0.5em;
-        }
-      }
-      .update-img {
-        text-align:right;
-        img {
-          margin:-0.5em -1em 0 0.5em;
-          height:auto;
-        }
-      }
+      @include clearfix;
     }
-  }
-}
-//display:table fixes
-.ie7, .ie7 {
-  .issue-list li .update-wrap {
-    .update-text {
-      float:left;
-      width:19em;
+    .update-text p {
+      margin-bottom: 0.5em;
     }
     .update-img {
-      float:right;
+      float: right;
+      margin: 0.5em 0 0.5em 1em; // gutter between text and floated image
     }
   }
 }
@@ -966,12 +945,6 @@ a:hover.button-left {
     }
   }
 }
-//bit of a hack - as we can't use em's, push the span out to the right
-//by how much it would be if the user did not resize the text
-.issue-list li .update-wrap .update-img a span {
-  right:-16px;
-  top:-8px;
-}
 
 .problem-header {
   margin-bottom:1em;