Posts in the Personal Category

“Stacked ‘Borders’” Published at CSS-Tricks

Published 3 days ago

I toyed with the idea of nesting elements with borders and some negative margins to pull one border on top of another, or nesting a border inside an outline and then using negative margins to keep from throwing off the layout. But none of that felt satisfying.

It turns out there are a number of tricks to create the effect of stacking one border atop another by combining a border with some other CSS effects, or even without actually requiring the use of any borders at all. Let’s explore, shall we?

That’s from the introduction to my article “Stacked ‘Borders’”, which marks the first time I’ve ever been published at the venerable upstart CSS-Tricks.  (I’m old, so I can call things both venerable and an upstart.  You kids today!)  In it, I explore ways to simulate the effect of stacking multiple element borders atop on another, including combining box shadows and outlines, borders and backgrounds, and even using border images, which have a much wider support base than you might have realized.

And yes, as per my usual, the images in the piece are all double-dpi :screenshot captures directly from Firefox.

Many thanks to Chris Coyier for accepting the piece, and Geoff Graham for his editorial assistance.  I hope you’ll find at least some part of it useful, or better still, interesting.  Share and enjoy!


Breaking Silence

Published 1 week ago

So it’s been (checks watch) half a year since I last blogged, yeah, okay, been a while.  I took a break, not that you would’ve been able to tell from the sporadic nature of updates before I did so, but a break I took nonetheless.  Well, break’s over.

One of things I plan to do is fill in a post I missed writing at the beginning of December: the 25th anniversary of my working with the web.  I’ll tell the story in that post, but suffice to say it involves a laptop, a printout of the HTML specification, Microsoft Word 5.1a, a snagged Usenet post, and Mystery Science Theater 3000.  Keep circulating the tags!

Before that happens, I’ll be posting a review of the return of a very old, very faithful assistant.  I also have an article coming on a site where I’ve never been published before, so that’s exciting—look for an announcement here as soon as it’s public.  Stay tuned!


The China Anniversary

Published 8 months, 3 days ago

It was twenty years ago today, under the wide-spreading boughs of a tree in the front yard of a house on Long Island, that Kat and I exchanged our wedding vows before a small crowd of friends and family.  Immediately after, we all moved to the tent in the back yard to celebrate.

The twentieth anniversary is, traditionally, the china anniversary.  Kat’s immediate reaction upon hearing this was that it makes total sense, since by 20 years you’ve probably broken most of your wedding china and need replacements.  For us, though, the resonance is a little different, since our honeymoon was a trip to China.  And therein hangs an origin story.

At some point in the late 1997, Kat and I were at a Meyer family gathering, probably Thanksgiving, at my paternal grandparents’ house in Cincinnati.  As was my wont, I was perusing the stacks of National Geographics they had always lying around.  Not like in a dentist’s office; no, these were always up to date.  But there were always many of them, interleaved with many similarly contemporary Readers’ Digests.

I picked up one with a cover shot and title about China’s Three GorgesNational Geographic, September 1997 issue , and started leafing through it, eventually reaching the cover story.  It chronicled the incredible landscapes of the Three Gorges of the Yangtze River, soaring cliff faces and ancient villages.  I was immediately captivated by the story and especially the photography.  I decided that I wanted to see the Gorges before they were submerged by the Three Gorges Dam Project, which is the sort of snap decision I almost never make.  Usually I take time to analyze an idea and game out scenarios before reaching a conclusion, but not this time.  I was immediately certain.  I was certain enough to say it out loud to other people, like Kat and my parents and, who knows, probably a bunch of my extended family.

Now, fast forward a bit.  At the end of that same year, Kat and I were with my parents for Christmas.  We went out to dinner at Mom’s favorite spot for her birthday (also Boxing Day) and my parents said they had presents for me and my sister.  We each got an envelope.

Both of them contained checks for several thousand dollars, windfall of an inheritance distribution that Mom had insisted be passed on to us.  In mine, with the check, were a number of brochures for tours of China.

I was speechless.  Kat asked what it was a couple of times, a little bewildered by the look on my face.

And here I must take a side trip.  Kat and I had been on a trip to California a few weeks prior, just the two of us.  We spent a couple of nights at Ragged Point, a spot I’d stumbled over on a previous solo trip, back in the days when the rooms intentionally had no TVs or phones.  The restaurant was booked by a large group, so we ate dinner alone on the open patio under a heat umbrella, looking at the stars and enjoying the fantastic food; the chef at the time was a genius.  Music played softly through hidden speakers, and although we were literally sitting outside it felt as quiet and private as any candlelit back room.

The Christmas Song”, generally better known as “Chestnuts Roasting on an Open Fire”, started playing.  Kat, smiling, asked me if I would like to dance.  So we stood and danced close together, slowly shuffling around the open space the way untrained dancers do, just us and the song and the stars.

Kat swears I drew breath and opened my mouth to ask her to marry me.  Maybe she’s right.  But I didn’t, then.  Nor the next day.  Nor on Christmas Day.  Which caused Kat to start thinking that maybe it wasn’t going to happen at all.  She was feeling disappointed and hurt by this, as you can probably imagine, but keeping it to herself because she wasn’t sure yet if she was right or wrong.

So: back to Mom’s birthday dinner in Mansfield, Ohio, and me sitting stunned by the check and the China brochures and this unexpected, unprecedented windfall.

“Eric, what is it?” Kat asked again, with some concern starting to color her words.

“We’re going to China!” I finally blurted out.

“No, you’re going to China,” she replied a little tartly.

“No, we’re going to China,” I repeated.

Because in that moment, right there, I knew that this trip I wanted to take, the things I wanted to see so badly before they were gone—I couldn’t imagine doing and seeing all that without Kat.

That’s when I knew, beyond any shadow of a doubt, that I wanted to marry her.

I didn’t propose that night either, because I had to explain this all to her in halting, still-new words and help her (and me!) understand what had happened.  She got it, as I think I knew she would.  We went shopping for rings just after the New Year.  I formally proposed to her, shivering on an ice-crusted deck by the Chagrin Falls, on her birthday in March.

And on July 19th, 1998, we stood underneath the spreading boughs of the tree in the front yard of her childhood home, and exchanged our wedding vows.  A short time later, in a backyard tent in the heat of a mid-July afternoon on Long Island, we stood on the compact dance floor and danced to “The Christmas Song”, baffling half the attendees and bemusing the other half.

The next very day, we flew to China, and saw so much together over the next seventeen days: the Three Gorges, yes, but much more.  Suzhou, Dazu, and Guilin stand out in particular for being a little more remote and not so overrun by tourists, the kinds of spots we always find inherently more interesting than large cities and glitzed-up, polished destinations.  We still want to go back to Guilin some day.

In the two decades since we vowed to love and honor and respect and amuse each other, we’ve had many adventures together.  Some were incredible, some were stressful, and some I would have spared us both.  Picking out a card was difficult, with so many of them written as if 20 years together could never be anything but an unbroken stretch of bliss and good fortune.  We’ve been through too much to respond well to such bromides; we’ve had fortune great and terrible, difficulty and ease, endless joy and boundless grief.

Every one of those days and weeks and months and years, we’ve supported and shared with each other.  Kat’s been so strong, and so selfless, and I’ve tried to be the same for her.  Neither of us did so perfectly, but we always tried—and we always understood when the other had to nurse a weakness, or look inward for a while.  We have always been honest with each other, and accepted each other.  That, more than anything, is what’s allowed us to travel together these two decades and still love each other.

I couldn’t have asked for a better partner in life and death than Kat, and I hope she’s even half as proud of and grateful for me as I am for her.

Happy China Anniversary, my love.

On a train to Amsterdam, June 2018

Decimated

Published 9 months, 2 weeks ago
Rebecca blows out the candles on a birthday cake.

In another timeline, an early alarm woke Kat and me this morning so we could sneak into Rebecca’s room with her siblings and wish her a happy birthday at the moment she turned ten, 7:24am, June 7th, 2018.

Two digits.  It’s a big milestone, in its way.  Rebecca’s best friend Ruth passed it a few days ago.  Ruth, who she called “Ruthie”.  Who shared all three of her initials, and practically had the same birthday.  Who was the last person to whom Rebecca ever spoke a complete sentence in her full voice, the morning of the day before she died: “Goodbye Ruthie, I love you, MWAH!”

Ruth, who still dreams of Rebecca, happy dreams that make her waking sad.

I have dreams like that too, when I remember them.  I don’t often remember my dreams.  But sometimes, I get to spend a little time with her, free of sorrow, on a nighttime walk or at an amusement park my subconscious constructed out of all the parks we ever took her to.

Kat and Carolyn and Joshua and I went to the grave marker this morning, because Kat works all afternoon into the evening and Joshua has an all-day LEGO and chess camp and Carolyn has friends to see before summer vacation gets crazy.  Because life moves on even when a part of you can’t understand why the sky doesn’t collapse and the world doesn’t crack open and time doesn’t shatter into a million sharded memories.  Classes get taken, grades get graduated, camps get attended, trips get planned, work has to be done.  Each day follows on the one before, pulling you further and further away from the last moments your life was normal.

We stood or sat or huddled around the flecked slate blue granite slab under the gray clouds of morning, emotions flaring and fading, subsumed by a profound sorrow without many tears.  We’re too used to it, now.  The sobs of previous years have given way to a steeled mourning.  Sometimes there is resentment at the stupid blind unfairness of the holes shot through all our hearts, the hole in our lives, and all the things she and we never got to experience.

Her playgroup friends still talk of her with their parents.  Rebecca was a good friend, she was funny, she was fun, she was so nice.  In their way, still trying to come to grips with what happened to her.  To them.

They don’t mention her to us.  Children, trying to protect the grown-ups.

Which makes sense, since they know, now, that sometimes grown-ups can’t protect the children.  Sometimes the killer gets into the house and there is nothing you can do to cast it out.

Sometimes there is nothing anyone can do, except hold the victim’s hand as her life ebbs away, and wish your desperate pleas to take her place had been heard.  That there was something to hear, anything to hear, and accept a frantic parent’s bargain of life for life.

Ten years ago today, Rebecca came into this world.  Four years ago today, she left it.

I can’t remember if I ever told her I would never forget her, or if I was too afraid of frightening her.

I clearly remember when and where she told me, sobbing, knowing she would die, that she would never forget me.

I can still recall the terrified strength in her arms, locked around my neck.

I hope I told her then.

Today she should have been ten.


A St. Baldrick’s Appeal From Joshua

Published 1 year, 2 days ago

In March of 2014, our son Joshua, then a newly-minted three-year-old, shaved his head for St. Baldrick’s for the first time, in support of his sister Rebecca, who at the time seemed to be in remission.  This coming Sunday, now in support of all St. Baldrick’s beneficiaries and in memory of the sister with whom he shared so much love, he’ll shave his head for the fifth time.  He’s been letting his hair grow out since the start of the year just for this occasion, and he’s already looking forward to 2020, when he will officially become a Knight of the Bald Table—at the age of nine.

As he was last year, Joshua is a member of Team Fairfax, representing the elementary school all three of our kids have attended.  This year he was designated a Team Captain despite only being a first-grader.

Joshua surpassed his initial goal and set a new, much more ambitious threshold of $1,200.  As I write this, he’s just over $150 away.  If you can help him get over and beyond that line, he—and I—would very much appreciate it.


“CSS Pocket Reference, 5th Edition” to Production

Published 1 year, 1 month ago

Just over an hour before I started writing this post, I handed off CSS Pocket Reference, 5th Edition to the Production department at O’Reilly.  What that means, practically speaking, is that barring any changes that the editors find need to be made, I’m done.

Besides all the new-new-NEW properties included in this edition (flexbox and grid being just two of the most obvious examples), we put a lot into improving the formatting for this edition.  Previous editions used a more sprawling format that led to the 4th edition getting up to 238 pages, which cast serious shade on the word “Pocket” there in the title.  After all, not all of us live in climates or cultures where 24/7 cargo pants are a viable option.

So with a few ideas from me and several more from the production team, we managed to add in all the new properties and still bring the page count down below 200.  My guess is the final copy will come in about 190 pages, but much will depend on how crazy the indexer gets, and how much the formatting gets changed in the final massaging.

We don’t have a firm release date yet; I’m pulling for April, but it’s really not up to me.  I’ll make announcements via all the usual channels when pre-order is available, and of course when publication day arrives.

For now, for the first time in many years, I don’t have a book project on my to-do list.  I don’t even have a book proposal on my to-do list.  It’s a slightly weird feeling, but not an unwelcome one.  I’ll be putting the extra time into my content for An Event Apart: I’m giving a talk this year on using the new CSS tools to make our jobs easier, and doing Day Aparts in Boston and San Francisco where I spend six hours diving deep into guts of stuff like flexbox Grid, writing modes, features queries, and a whole lot more.

So my time will continue to be fully spoken for, is what I’m saying.  It’ll all be fun stuff, though, and it’s hard to ask for more out of my work.


My Contribution to “Modern Loss”

Published 1 year, 1 month ago

 

My wife Kat and I tell ourselves we’d love another child for who they are, not for who they replace. We even believe it. But we can’t be sure of it—and that keeps us from shutting our eyes, jumping back into the adoption process, and hoping it will turn out okay. We know all too horribly well that sometimes, it doesn’t.

That’s the opening of my essay “The Second Third Child”, included in the new book from Modern Loss titled Modern Loss: Candid Conversation About Grief. Beginners Welcome, published this week.

I’m deeply honored to be one of the 40+ contributors to the book, some of whom you may know—Dresden Dolls co-founder Amanda Palmer, CNN’s Brian Stelter, author Lucy Kalanithi, Dear Evan Hansen director Michael Greif, Stacy London of What Not To Wear—and many of whom you may not, as I will be unknown to the vast majority of the book’s readers. I’ve written articles for Modern Loss in the past, but to be entrusted with a part of their first book was humbling.

Several of the essays in the book are intentionally funny, but mine is not one of them. It’s quiet, reflective, and elegiac in more than one way, but never anything but honest. It appears in the first section of the book, titled “Collateral Damage”.

As Stephen Colbert put it: “Talking about loss can feel scary. This book isn’t. It’s about grieving deeply over the long term, and the reassurance that you’re far from broken because of it.” I hope my essay, and the book as a whole, helps readers to come to terms with their own grief, by seeing that they are not alone, and that they did the best they could even if it doesn’t feel that way at all.

All my thanks to Rebecca Soffer and Gabrielle Birkner for making me a part of their incredible, inspiring work.


The Newwwyear Design

Published 1 year, 2 months ago

Well, here it is—the first new design for meyerweb since February 2005 (yes, almost 13 years).  It isn’t 100% complete, since I still want to tweak the navigation and pieces of the footer, but it’s well past the minimum-viable threshold.

My core goal was to make the site, particularly blog posts, more readable and inviting.  I think I achieved that, and I hope you agree.  The design should be more responsive-friendly than before, and I think all my flex and grid uses are progressively enhanced.  I do still need to better optimize my use of images, something I hope to start working on this week.

Things I particularly like about the design, in no particular order:

  • The viewport-height-scaled masthead, using a minimum height of 20vh.  Makes it beautifully responsive, always allowing at least 80% of the viewport’s height to be given over to content, without requiring media queries.
  • The “CSS” and “HTML” side labels I added to properly classed pre elements.  (For an example, see this recent post.)
  • The fading horizontal separators I created with sized linear gradients, to stand in for horizontal rules.  See, for example, between post content and metadata, or underneath the navlinks up top of the page.  I first did this over at An Event Apart last year, and liked them a lot.  I may start decorating them further, which multiple backgrounds make easy, but for now I’m sticking with the simple separators.
  • Using string-based grid-template-areas values to rearrange the footer at mobile sizes, and also to make the rare sidebar-bearing pages (such as those relating to S5) more robust.

There are (many) other touches throughout, but those are some high points.

As promised, I did livestream most of the process, and archived copies of those streams are available as a YouTube playlist for those who might be interested.  I absolutely acknowledge that for most people, nine hours of screencasting overlaid with rambling monologue would be very much like watching paint dry in a hothouse, but as Abraham Lincoln once said: for those who like this sort of thing, this is the sort of thing they like.

I was surprised to discover how darned easy it is to livestream.  I know we live in an age of digital wonders, but I had somehow gotten it into my head that streaming required dedicated hardware and gigabit upstream connections.  Nope: my five megabit upstream was sufficient to stream my desktop in HD (or close to it) and all I needed to broadcast was encoding software (I used OBS) and a private key from YouTube, which was trivial to obtain.  The only hardware I needed was the laptop itself.  Having a Røde Podcaster for a microphone was certainly helpful, but I could’ve managed without it.

(I did have a bit of weirdness where OBS stopped recognizing my laptop’s camera after my initial tests, but before I went live, so I wasn’t able to put up a window showing me while I typed.  Not exactly a big loss there.  Otherwise, everything seemed to go just fine.)

My thanks to everyone who hung out in the chat room as I livestreamed.  I loved all the questions and suggestions—some of which made their way into the final design.  And extra thanks to Jen Simmons, who lit the fire that got me moving on this.  I enjoyed the whole process, and it felt like a great way to close the books on 2017.