A little CSS3 usage

My last gig had a relatively small amount of front-end work to it. I mostly plugged in standard form markup onto a common form and wrote the javascript for handling the interaction. I've recently had a chance to do more markup and am please by what I'm learning.


I recently put together a job application and a new resume. After years of keeping my resume in a text file, I've never liked having it in a word processor. So I took some time to convert it to an html document. CSS Flexible boxes, I love you.


// the heading line
.experience-heading {
    margin-left: -20px;
    display: flex;
    align-content: space-around;
    width: 103%;
    font-weight: bold;

// keep this to the left
.experience-position {
    margin-left: 0px;
    margin-right: auto;

// keep this to the right
.experience-duration {
    margin-left: auto;
    margin-right: 0px;


    <div class="experience">
        <div class="experience-heading">
            <div class="experience-position">Software Engineer &amp; Advertising champion, Zattoo.com</div>
            <div class="experience-duration">Jan 2011 To July 2013</div>
            Zattoo is a European virtual cable provider offering live television on computers, mobiles, smart televisions, and set-top boxes.  Bill created front-end user interfaces on desktop and mobile websites, managed and improved the server-side API and advertising system, and worked with marketing on promotional landing pages and displays.
        <h4>Major contributions:</h4>
            Transitioned the Zattoo ad infrastructure across vendors on a heroic timeframe. Specified, rewrote, deployed, tested, and supported operations to enable the switch before the extremely popular EUFA Euro 2012.  Work spanned user front-end (web, iOS, android), Zattoo application servers, and vendor systems.
            Bootstrapped and launched Zattoo’s Live TV Android App.  Managed the major challenge of Android’s lack of live streaming video protocols.

Yields a very nice left & right justified line that I like so much.

Viewport Units

After thinking about tweeting about my ember post, I had a look at my domains, they are in shambles since I nuked ye olde slicehost instance.

So, I made some new placeholder pages and learned a little CSS3. Specifically viewport units for sizing. You'll see its use in this stunning gone-fishing page for the kwerl and quickreleaselever top pages:

<!DOCTYPE html>  
        <meta charset="utf-8">
        <title>quick release lever</title>
        <style type="text/css">
            .biggie {
                height: 100vh;
                background: #fff no-repeat center center;
                background-size: contain;
                background-image: url(qrl.png);
        <div class="biggie"></div>