ElfUrl Sidebar Enhancement

ElfUrl is a service that generates short urls for long and unwieldy urls. Anything with a whopping great query string (Amazon search results, for example) can be converted into a short code that’s easier to recite and won’t break in email.

ElfUrl is preferable to the ubiquitous TinyUrl.com simply because it has a cleaner homepage, it does some trickery with del.icio.us and it’s green.

The homepage mark-up is still bad though. table layout is present, which is a shame, because that prevents it being squashed into a limited horizontal space like, say, the Firefox sidebar (which you can invoke from the properties dialog of the ElfUrl bookmarklet, or any other bookmark).

To fix it, and enable a whole box of sidebar joy, here’s some Firefox 1.5 and Camino compatible user-css. It uses Gecko’s new url media selector to avoid breaking other pages.

/* ElfUrl.com */
@-moz-document url-prefix(http://elfurl.com/) {
    #headercontainer, #header
    {
      height: auto !important;
    }
    #logo
    {
      position: static !important;
    }

    #logo img
    {
     max-width: 99% !important;
    }

    #toplinks
    {
    text-align: left !important;;
    }

    #maincolcenter, #maincol, #container
    {
      margin-left: 0; margin-right: 0;
      padding-left: 0; padding-right: 0;
    }

    #maincolcenter > table,
    #maincolcenter > table tr,
    #maincolcenter > table td
    {
     display: block;
     text-align: left;
     margin: auto;
     padding: 0;
     width: 95%;
    }

    div
    {
     max-width: 99% !important;;
    }

    input[type=text] {
    width: 95% !important;;
    }

    input[type=submit] {
    margin: 0 !important;
    }

    /* ads will be beyond the vertical scroll anyway, so just  hide them rather than fixing the layout */
    #container > #maincolcenter > table + table *
    {
      display: none;
    }
}