James Emmrich

20 Oct, 2008

Websites Birthed from CSS Hell

Posted by: James In: ProTip|Software|Web Development

Over the years I have come across a few websites that I want to visit on a regular basis. These websites are designed by “web designers” with no skill whatsoever. Infact, I sincerely believe that a retarded monkey with carpal tunnel and OCD could tap out a clear and functional design that would greatly out perform the hideous creation of this so called human “web designer.”

In this post you will learn how to take matters into your own hands and fix these websites so they are at least bearable. We will learn how to change the font and font size for a particular website.

Requirements:

  • Firefox
  • Firefox extension: Stylish
  • Knowledge of CSS (cascading style sheets)

Getting started with Stylish

After the extension has been installed and Firefox has been restarted. Go to the bottom right hand corner and click on the Stylish icon. In the menu, click on the Manage Styles…

Because we do not have any scripts, there is nothing to display, so click on the Write… button and lets get started.

Write out the following code as show in the example below. Here, we are using example.com as well, our example. The trusty folks over there have provided us with a simple boring page. Substitute example.com with the URL that will apply to your case.

By pressing Save, you should have no error messages and be presented with a list of scripts installed. In our case, it looks like so.

Go back to the nightmarish website. You may have to refresh the page to see the results.

Example forum from hell, before:

Example forum from hell, after:

Don’t think you can have to stop here! CSS is very powerful and together with Stylish, you can virtually redesign any website the way YOU want it to look.

Check out the user submitted styles found here: http://userstyles.org/

ProTip!

  • Look into the Adblock Plus extension. Not only is this great for removing advertisements from websites, but allows you to block or hide obnoxious images and other content from displaying. Perfect for websites with a huge picture at the top forcing you to scroll every page view.
  • Read up on CSS, specifically the display: none; syntax for hiding elements within a page.


Tweet This

No Responses to "Websites Birthed from CSS Hell"

Comment Form

Categories

Upcoming Events

  • Sat, Jul 31 – Sun, Aug 1:CMRC Ontario ATV - Burnt River
  • Sun, Aug 1:CMRC Pro National - Moncton
  • Sat, Aug 7 – Mon, Aug 9:TransCan Tail Gate Party - Blyth
  • Sun, Aug 8:CMRC Pro National - Sand Del Lee
  • Tue, Aug 10 – Sat, Aug 14:Wiseco Amateur Canadian Grand National Championships
  • Sat, Aug 14 – Sun, Aug 15:CMRC Ontario ATV - MotoPark
  • Sun, Aug 15:CMRC Pro National - Walton
  • Sat, Aug 21 – Sun, Aug 22:CMRC Ontario ATV - X-Town, Quebec
  • Sun, Aug 22:CMRC Ontario Cross Country Series - Wingham
  • Sat, Aug 28 – Sun, Aug 29:CMRC Ontario ATV - Parry Sound