replaces media query with flexbox

app/assets/stylesheets/pages/issuable.scss

@@ -461,17 +461,19 @@
 
 .issuable-list {
   li {
-    .issue-info-container {
-      display: inline-block;
-      width: 96.5%;
 
-      @media (max-width: $screen-md-max) {
-        width: 95%;
+    .issue-box {
+      display: -webkit-flex;
+      display: flex;
     }
+
+    .issue-info-container {
+      -webkit-flex: 1;
+      flex: 1;
+      padding-right: $gl-padding;
     }
 
     .issue-check {
-      float: left;
       padding-right: $gl-padding;
       margin-bottom: 10px;
       min-width: 15px;

app/assets/stylesheets/pages/merge_requests.scss

@@ -268,11 +268,12 @@
   .merge-request {
     padding: 10px  0 10px 15px;
     position: relative;
+    display: -webkit-flex;
+    display: flex;
 
     .issue-info-container {
-      @media (max-width: $screen-xs-max) {
-        width: 88%;
-      }
+      -webkit-flex: 1;
+      flex: 1;
     }
 
     .merge-request-title {

app/views/projects/issues/_issue.html.haml

 %li{ id: dom_id(issue), class: issue_css_classes(issue), url: issue_path(issue), data: { labels: issue.label_ids, id: issue.id } }
+  .issue-box
     - if @bulk_edit
       .issue-check
         = check_box_tag dom_id(issue, "selected"), nil, false, 'data-id' => issue.id, class: "selected_issue"