Tweaking a WordPress Theme: Removing Banner Space

Intending to hack this theme (Twist of Ten) to pieces, so have nothing much to gain from overriding with a child theme. Forked it instead by renaming its directory.

1. Relevant markup:

   html
      body.blog.home.rtl
         #wrapper.hfeed
            #header
               #rss-subscribe
               #masthead
                  #branding {position: relative; width: 940px}
                     h1#site-title {z-index: 1; position: absolute; top: 50px}
                        span
                        #site-description
                     img {display: block}
                  #access -- navigation bar

2. Removed the float and width on h1. Changed left to {right: 1em}.
3. To superimpose the h1 text on the image, it’s taken out of the flow with {position: absolute}, and given {z-index: 1}. The {position: relative}on its parent div is to specify relative to which parent the h1 is positioned. (The names of the CSS properties are all wrong. Can’t find a reference to that article. Nu.)
4. img is the header’s background image. It’s a 940×198 JPEG. Bah, should be a PNG?
5. The {display: block}seems a trick to avoid some whitespace, presumably due to line spacing? Not sure. (Hmm, img is inline by default?)
6. But, why is this /background/ image in HTML instead of CSS? Isn’t it a stylistic element?
7. Divitis?