On Swapping Twitter’s Columns Around

Yesterday morning I logged into Twitter. This is what I saw:

Yes, I’d been upgraded to “New New Twitter,” which began going live to users a month and a half ago.

It’s fine, and it’s functional, but one thing irked me.

I didn’t like the column layout. For as long as I’ve been using Twitter, the stream is on the left, and the sidebar is on the right, and the new design has those flipped — sidebar on the left, stream on the right. The first thing I see in the top right when I log into Twitter shouldn’t be who I am, since I know who I am. It’s the content that I want, and that should be on the left. 🙂

Fortunately, that was an easy CSS fix. I opened up Opera Dragonfly (the code debugger), figured out what the DIVs were called, and I wrote these two lines of code:

.dashboard {
     float: right !important;
}

.content-main {
     float: left !important ;
}

Now when I access Twitter, Opera pulls up a stylesheet just for Twitter, and the columns are flipped around — stream on the left, sidebar on the right — just like so…

Nicely done. 🙂

Firefox users, this is the code you would want to add to your userContent.css file to flip “New New Twitter”‘s columns around:

@-moz-document domain(twitter.com) {
    .dashboard {
         float: right !important;
    }

    .content-main {
         float: left !important ;
    }
}

The fun things one can do with local code. 🙂