Improved styling of the threeboxes layout

It's still not perfect, though:
- New version is table-based - meh.
- Uses negative margins more than once - meh!
- Only works if any of the columns has enough content to wrap. If all
  content fits in the columns without wrapping, the total table width
  falls back to the "min-width: 100%" statement - which, with the
  negative margins, isn't really 100%. MEH!

Still... it looks better than the previous solution.

So far tested on FF3.5, Opera 9.something, and some semi-recent version
of webkit. Reported to work fine on IE7 as well.

1 files changed, 52 insertions, 47 deletions

diff --git a/lib/VNDB/Handler/Tags.pm b/lib/VNDB/Handler/Tags.pm
index 8f0e1486..eefede3c 100644
--- a/lib/VNDB/Handler/Tags.pm
+++ b/lib/VNDB/Handler/Tags.pm
@@ -596,58 +596,63 @@ sub tagindex {
   my $t = $self->dbTagTree(0, 2, 1);
   _childtags($self, {childs => $t}, 1);
 
-  # Recently added
-  div class => 'mainbox threelayout';
-   a class => 'right', href => '/g/list', 'Browse all tags';
-   my $r = $self->dbTagGet(order => 'added DESC', results => 10, state => 2);
-   h1 'Recently added';
-   ul;
-    for (@$r) {
-      li;
-       txt age $_->{added};
-       txt ' ';
-       a href => "/g$_->{id}", $_->{name};
-      end;
-    }
-   end;
-  end;
+  table class => 'mainbox threelayout';
+   Tr;
+
+    # Recently added
+    td;
+     a class => 'right', href => '/g/list', 'Browse all tags';
+     my $r = $self->dbTagGet(order => 'added DESC', results => 10, state => 2);
+     h1 'Recently added';
+     ul;
+      for (@$r) {
+        li;
+         txt age $_->{added};
+         txt ' ';
+         a href => "/g$_->{id}", $_->{name};
+        end;
+      }
+     end;
+    end;
 
-  # Popular
-  div class => 'mainbox threelayout';
-   $r = $self->dbTagGet(order => 'c_vns DESC', meta => 0, results => 10);
-   h1 'Popular tags';
-   ul;
-    for (@$r) {
-      li;
-       a href => "/g$_->{id}", $_->{name};
-       txt " ($_->{c_vns})";
-      end;
-    }
-   end;
-  end;
+    # Popular
+    td;
+     $r = $self->dbTagGet(order => 'c_vns DESC', meta => 0, results => 10);
+     h1 'Popular tags';
+     ul;
+      for (@$r) {
+        li;
+         a href => "/g$_->{id}", $_->{name};
+         txt " ($_->{c_vns})";
+        end;
+      }
+     end;
+    end;
 
-  # Moderation queue
-  div class => 'mainbox threelayout last';
-   h1 'Awaiting moderation';
-   $r = $self->dbTagGet(state => 0, order => 'added DESC', results => 10);
-   ul;
-    li "Moderation queue empty! yay!" if !@$r;
-    for (@$r) {
+    # Moderation queue
+    td;
+     h1 'Awaiting moderation';
+     $r = $self->dbTagGet(state => 0, order => 'added DESC', results => 10);
+     ul;
+      li "Moderation queue empty! yay!" if !@$r;
+      for (@$r) {
+        li;
+         txt age $_->{added};
+         txt ' ';
+         a href => "/g$_->{id}", $_->{name};
+        end;
+      }
       li;
-       txt age $_->{added};
-       txt ' ';
-       a href => "/g$_->{id}", $_->{name};
+       txt "\n";
+       a href => '/g/list?t=0;o=d;s=added', 'Moderation queue';
+       txt ' - ';
+       a href => '/g/list?t=1;o=d;s=added', 'Denied tags';
       end;
-    }
-    li;
-     txt "\n";
-     a href => '/g/list?t=0;o=d;s=added', 'Moderation queue';
-     txt ' - ';
-     a href => '/g/list?t=1;o=d;s=added', 'Denied tags';
+     end;
     end;
-   end;
-  end;
-  clearfloat;
+
+   end; # /tr
+  end; # /table
   $self->htmlFooter;
 }