How to Output Floating DIVs instead of Tables in Drupal Views: Grid View

The Grid View in Drupal's Views module works like a charm when presenting data in configurable blocks, but the interface is not responsive because the Grid View uses tables instead of div's in the markup. This poses a usability issue when your Grid View is being viewed in a mobile device because a wide table won't scale down to fit into the limited viewport of mobile devices such as smartphones.

To fix this, we need to edit the Views Grid template to use floating DIVs instead of tables to make our Grid responsive on any viewport or screen.

On Drupal 8, which uses the Twig template engine from Symphony, the Grid template no longer uses tables but DIVs instead.

On Drupal 7, you can convert the Views Grid tables with DIVs in two ways:

1) Override the default Grid template by creating the file views-view-grid.tpl.php inside your custom theme and pasting this code:

<?php
reset($rows);
$gridsize = count($rows[0]);
?>
<?php if (!empty($title)) : ?>
  <h3 class='grid-title'><?php print $title; ?></h3>
<?php endif; ?>
<div class="views-view-grid grid-<?php print $gridsize ?>">
    <?php foreach ($rows as $row_number => $columns): ?>
      <?php
        $row_class = 'row-' . ($row_number + 1);
        if ($row_number == 0 && count($rows) > 1) {
          $row_class .= ' row-first';
        }
        elseif (count($rows) == ($row_number + 1)) {
          $row_class .= ' row-last';
        }
      ?>
      <div class="<?php print $row_class; ?>">
        <?php foreach ($columns as $column_number => $item): ?>
          <div class="gridCol <?php print 'col-'. ($column_number + 1); ?>">
<?php if ($item): ?>
            <div class='grid-item'>
            <?php print $item; ?>
            </div>
<?php endif; ?>
          </div>
        <?php endforeach; ?>
      </div>
    <?php endforeach; ?>
</div>

2) If you don't mind install yet another module to achieve this, you can use the Views Responsive Grid module. https://drupal.org/project/views_responsive_grid