Page Comparison

{html}
<script type="text/javascript" src="http://www.fluidproject.org/releases/1.0/InfusionAll.js"></script>
<style>
.portlet {
  width: 75px;
  height: 40px;
  background-color: lightyellow;
  padding: 10px;
  margin: 0 10px 10px 0 !important;
  text-align: center;
}
table#portlet-reorderer-root{
  border: 1px solid black;
}
table#portlet-reorderer-root td {
  padding: 8px;
  vertical-align: top;
  border: 1px solid black;
}
#portlet-reorderer-root .orderablefl-reorderer-movable-default{
  border: 2px solid #ddd;
}
#portlet-reorderer-root .orderablefl-reorderer-movable-hover{
  border: 2px solid #666;
}
#portlet-reorderer-root .orderablefl-reorderer-movable-dragging{
    background-color: white;
}
#portlet-reorderer-root .orderablefl-reorderer-movable-selected{
  border: 2px solid #666;
  background-color: #ddd;
}
#portlet-reorderer-root .orderablefl-reorderer-movable-avatar {
  height: 25px;
  width: 50px;
  background-color: blue;
  opacity: 0.75;
}
#portlet-reorderer-root .orderablefl-dropreorderer-markerdropMarker{
  height: 4px !important;
  width: 80px;
  background-color: green;
}
</style>
<script type="text/javascript"> 
    jQuery(document).ready(function () {
        fluid.reorderLayout ("#portlet-reorderer-root", {
          selectors: {
            columns: "td",
            modules: "td > div"
          }
        });
    });
</script>
<table id="portlet-reorderer-root">
  <tbody>
    <tr>
      <td id="c1">
        <div class="portlet" id="portlet1">
          <div class="title">portlet 1</div>
          <div class="content">&nbsp;</div>
        </div>
        <div class="portlet" id="portlet2">
          <div class="title">portlet 2</div>
          <div class="content">&nbsp;</div>
        </div>
        <div class="portlet" id="portlet3">
          <div class="title">portlet 3</div>
          <div class="content">&nbsp;</div>
        </div>
      </td>
      <td id="c2">
        <div class="portlet" id="portlet4">
          <div class="title">portlet 4</div>
          <div class="content">&nbsp;</div>
        </div>
      </td>
      <td id="c3">
        <div class="portlet" id="portlet5">
          <div class="title">portlet 5</div>
          <div class="content">&nbsp;</div>
        </div>
        <div class="portlet" id="portlet6">
          <div class="title">portlet 6</div>
          <div class="content">&nbsp;</div>
        </div>
      </td>
      <td id="c4">
      </td>
    </tr>
  </tbody>
</table>
{html}