Want to read Slashdot from your mobile device? Point it at m.slashdot.org and keep reading!


Forgot your password?
Check out the new SourceForge HTML5 internet speed test! No Flash necessary and runs on all devices. Also, Slashdot's Facebook page has a chat bot now. Message it for stories and more. ×
User Journal

Journal Journal: Slashdot User CSS

Slashdot quietly added some nice new functionality to its latest revision, but also made a number of visual design choices that are ... regrettable. I'll spare you further comments, suffice to say that until now I wasn't compelled to fix it up til now.

For anyone wanting to apply this style sheet, I recommend Stylish. Once installed, you'll find its icon on your status bar (probably off to the far right side -- it looks like a write/wordpad icon). Right click that, select "write style", select "for slashdot.org" and replace whatever is in the window with this CSS:

(Those not using Firefox+Stylish shouldn't have much trouble snipping out the relevant CSS).

  * slashdot_suckless.css
  * License:
  * Do Whatever The Hell You Want Public License.
  * You can claim you wrote it for all I care.
  * Fixes in this CSS:
  * - Lightens and reduces size of the super-obtrusive reply buttons below every post.
  * - Slims the chunky comment frame outline from 4px to 1px.
  * - Article categories moved to the right and de-emphasized (fixed font size, I'm sorry!)
  * - That is all for now.

@namespace url(http://www.w3.org/1999/xhtml);

@-moz-document domain("slashdot.org") {

        background: #eee !important;
        color:#666 !important;
        padding: .1em 0 !important;

.nbutton p b a {
        background: #eee !important;
        padding: .1em 0.25em !important;
        color:#666 !important;

.contain {border: 1px solid #e6e6e6 !important; border-top: none !important;}

.comment .full div.title, .comment .full div.details {margin: 0 !important }

/* The article categories were always a typographical disaster. Fixes here. */

div.article div.title h3 span { float: right !important; font-size: 10px !important; }

div.article div.title h3 span a { text-decoration: none !important; }

/* I can't easily get rid of the extraneous colon, but I can make them part of the styling */

div.article div.title h3 span:before { content: "::" !important; }

div.article div.title h3 span:after { content: ":" !important; }


I'll update this as I find more things to fix. Suggestions are welcome: feel free to send me snippets of individual fixes.

I'm aware of total re-theme packages (many of which are listed by stylish) and I'm not particularly interested in them. Adblocking is also something I won't add here, since I take care of that with a separate addon (and only for the most annoying ads).

Slashdot Top Deals

Today is the first day of the rest of your lossage.