Content-Type: RST

Oh my goodness! Filip finally used some images and color in his
styling! Pigs should start flying anytime now... 

I thought that since I now have a flashy domain name to host my
website on, I could deal with some interesting looking formatting for
my content. Side note: much thanks to jwalsh_ for the
background. Now, I liked my layout just fine, so I just edited the CSS
files (and the HTML to add a couple of class attributes). Of note,
though, that some of it is only fully viewable in Firefox 3.5 and
Safari 4 (because I used the unreleased CSS 3 specification).  

.. _jwalsh: http://www.selectivelysane.com

.. figure :: http://blog.opensourcenerd.com/upload/wait-what

   The regular internet user's reaction to what I just said. 

I'll take it slowly. CSS_ stands for Cascading
Style Sheets. CSS is pretty much *the* standard for styling
webpages and other media formatted by a markup language (such as
HTML). Styling? Check out my previous blog post without any aid from
CSS. Pretty bland, though you can still enjoy my witty wonderful
monologue. I won't go into the details of how this is done, but I will
provide an example from my site's code. This CSS: 

.. _CSS: http://en.wikipedia.org/wiki/CSS
.. _`without any aid from CSS`: http://www.opensourcenerd.com/resources/nocss.html

.. sourcecode :: css

   h1{
       display: inline;
       font-family: monospace;
       font-size: 30px;
       font-stretch: expanded;
       font-weight: bold;
   }

... renders this HTML:

.. sourcecode :: html

   <h1> Hello! </h1> 

... like this:

.. raw :: html

   <h1 style="display: inline; font-family: monospace; font-size:
   30px; font-stretch: expanded; font-weight: bold;">Hello!</h1>


If you'd like to know more about it, I recommend this `wonderful tutorial`_ from
w3schools. Now that we're (sort of) clear on what CSS is, let's talk
about why I think it's going to get so much cooler - and why it's
related to this being on an open source nerd's blog.

.. _`wonderful tutorial`: http://www.w3schools.com/css/

CSS 3
-----

... is the new standard for CSS, upcoming on some unknown date from
W3C. The current running specification is 2.1, and offers an enormous
number of features web developers have come to know and love: easy
text management, color and backgrounds, static and dynamic positioning
of different elements. However, it was lacking some things which still
made life difficult for developers. CSS 3 fixes most of these. Full
details can be found `here <http://www.w3.org/Style/CSS/current-work>`__, and a more
human-readable site on it (including previews) is `here
<http://www.css3.info>`__.

Right now, I'm using the following features of CSS 3:

- box-shadow
- text-shadow
- RGBA Colors
- border-radius (used it before, but now not Firefox-only)

If you're using Firefox 3.5, try finding them! This is made possible
by Firefox and a few other browsers (Edit: it renders just as
beautifully on Safari on the iPhone!) which included special
implementations of their own of the not-yet-released
standard. However, that proves for very ugly code. For example,
instead of the future working code: 

.. sourcecode :: css

    div {
    border-radius: 15px;
    box-shadow: 0px 0px 10px #00A; }

... I have to do:

.. sourcecode :: css

    div {
    border-radius: 15px;
    -moz-border-radius: 15px;
    -webkit-border-radius: 15px;
    -o-border-radius: 15px;
    -khtml-border-radius: 15px;
    box-shadow: 0px 0px 10px #00A;
    -moz-box-shadow: 0px 0px 10px #00A;
    -webkit-box-shadow: 0px 0px 10px #00A;
    -o-box-shadow: 0px 0px 10px #00A;
    -khtml-box-shadow: 0px 0px 10px #00A; }

Ugly. However, if you look at what I did there, you'll notice several
extensions. "-moz"? Mozilla (Firefox, Flock, and anything
Gecko). "-webkit"? Google Chrome and Safari. "-o"? Opera. "-khtml"?
Konqueror. Out of these, Firefox has the best and most complete
support for CSS 3 from what I see. 

Where's "-ie"? Answer: **It doesn't exist.** The human-readable site I
mentioned earlier has an article_ about
Internet Explorer's CSS 3 features, reviewing it as "not many". I
shouldn't make a big deal of this, since CSS 3 hasn't even been
released yet, so the IE developers might have time to hack something
up by then. I mean, IE 8 is only the first of their releases to fully
support the CSS 2.1 standard.  

.. _article: http://www.css3.info/css3-features-in-ie8/

In other news, local writer finally figured out the gosh-darn
newfangled typewriter. Needs to rest a few years before learning how
to use a computer keyboard.