A Sticky Situation by Ethan Marcotte

Ethan Marcotte:

Last week, I thought I’d clean up my blog entries a bit. (Yep. I’m that fun.) Before, there were a couple short but dense paragraphs, each containing a truckload of links: one linking to my archives, a couple links to read either the previous and next posts, and then a few trillion links to “share” the “entry” on “social media” “web-sites.” Now, that’s all been reduced to two links, one for the preceding entry, and one for the next one.

Ethan describes a bug he found with position: sticky and how it “magically” disappeared. I love writeups like this. More people (myself included) should do it.

Be Kinder to Each Other by Hui Jing

Hui Jing after reading some negative comments on the Update CSS Grid page of the Windows Developer Feedback site:

The world is not a perfect place. Life is not fair. But the matter of fact is, we live in this world together. All 7 billion (and more) of us share this planet. Nobody asked to be born, but we’re all here now. We all have a choice on how we want to behave, and these choices will have an impact on someone else, whether we are aware of it or not.

Microsoft is a big corporation and I’m sure everyone has their own perception and opinion of them. But within Microsoft, every employee is an individual human being, just like you, with thoughts and feelings. Furthermore, in a large corporation such as Microsoft, there will definitely be many internal dynamics and decisions outsiders like us are not privy to. Many engineers themselves probably won’t have the full picture.

What an excellent piece that so eloquently communicates a fundamental truth. The reality is that a lot of us like to bash on Microsoft for their browser issues, but Edge has come a long way. I believe that those developers are trying their best, and all the negativity doesn’t get us any closer to having CSS Grid implemented in Edge.

Instead, vote for the developers to update CSS Grid. You can also vote with your code by shipping sites that use Grid layout. As the saying goes, you catch more flies with honey than you do with vinegar.

CSS is Not Broken by Keith J. Grant

Keith J. Grant:

You cannot be proficient in JavaScript until you understand coercion, prototypal inheritance, and asyncronous(sic) flow control. Likewise, in CSS, you have to understand the cascade, inheritance, and the box model.

CSS is hard. But this is not because the language is faulty. Rather, the difficulty lies in what the language seeks to accomplish.

This article is one of the first fair pieces on the topic. These days, the fights going on around JavaScript and CSS can get pretty heated, with some going to some low places. If you feel CSS is broken, you are not stupid. CSS has a lot of quirks, and that’s why it can be difficult for those who don’t know it well yet.

Hell, I’ve been writing CSS for ten years, and I have many moments of frustration with it. Often, it’s because I didn’t plan my project correctly. CSS can be very unforgiving in that way.

Still, CSS is not broken. I couldn’t agree more with Keith’s last paragraph:

CSS isn’t broken. But it does require study and skill. It does require careful thought. As with anything in programming, you can make a mess of the code. Sure, blaming the language is the easy way out. But when your JavaScript is confusing and buggy, you know it’s not the language’s fault.

If you don’t want to learn CSS and its quirks, that’s fine! Let those of us who love CSS and don’t want to learn JavaScript’s quirks write it. In the meantime, we’ve got to stop calling each other idiots (or worse) for disliking a computer language. It’s not constructive and hinders all the amazing things we could be doing together.

Hassle-free Full Bleed with *:not() by Dave Rupert

Dave wrote this the day I went to Vegas and I haven’t had time to write about it.

Let’s say you’re making a blog post layout. Content is entered into a CMS inside a WYSIWYG editor field. You echo that content to the page. You pull it up on a mobile device and notice the paragraphs go edge-to-edge. Yikes, it’s a little uncomfortable. So you add some kind of left/right padding maybe using a div.container.

This works great until the client asks for the images and video to go full bleed. Your universal padding solution no longer works well.

Uncle Dave’s solution for this is pretty great. Visually, this is the type of layout I wanted for this site. So in an exercise of self-shame, let’s look at the selector that makes it all work!

.post__entry > p,
.search-results-list > p,
.page__entry > p,
.extendout figcaption,
.site__footer small,
.page__search {
  margin-left: auto;
  margin-right: auto;
  width: 90%;
  @media #{$large-up} {
    width: 65%;

Ugh! What the hell is this Tim? Gross! How I ever thought this was an elegant solution, I don’t know. But going back to what Dave says is perfectly illustrated in the code above. Using :not() allows you to only manage exceptions instead of all this. The actual elements that I want to “embiggen” as Dave calls it, are only a few. This selector would only contain around four or five exceptions.

Anyway, I need to put this on the list of things I need to rewrite for the next redesign.

Personal Site Redesigned

Three months ago, I set out to redesign my personal site. I usually start feeling the itch every year or so. I don’t really know what version this is, but feel free to look at previous iterations on the Wayback Machine.

This year, I’d learned a lot about CSS Grid, and I was determined to ship my new site using it. Little did I know how much support it’d have by now. As of this writing, Firefox, Chrome, Safari, Opera, iOS Safari, and Chrome on Android all support CSS Grid. That’s pretty amazing considering that when I started working on this refresh, I was using Firefox Nightly to make sure Grid was working.

In addition, to the Grid stuff, I’ve tried to add more of my personality to the site, and communicate who I am and what I’m good at. Also, the thing is speedy. With the cache disabled, it’s loading in 815ms. With the cache enabled, it’s fully loaded in 353ms. Even on Good 3G, the DOM is loaded in 657ms, with full page load coming in 3.68s. Obviously, there are always improvements to be made, but I’m really happy.

Another thing I focused on was to optimize space on large screens. I still think there’s work to do in this department, but it’s definitely better than previous versions. You’ll see that blog posts go from one column to two then three. I’m still containing content at a certain width, which some might disagree with but I like it.

I invite you to take a look, use your inspector tool (or look at the code on GitHub), and let me know what you think. If you have some constructive criticism send me an email. I’d love to hear from you.

Hello, I’m a Mac. And I’m a PC

I don’t know who I am any more

Or, an alternate sub-title: A long time Mac user and web developer’s perspective on the current state of Windows vs. macOS

Once upon a time when I was about seventeen, when I thought I was going to write music, play a guitar, and record it all, I needed a way to record sounds from my voice and guitar. My friend worked at Microsoft (Hi Dave), and he also used to record music before he become a developer. He recommended I get a cheap(ish) PC and dabble with the recording to see if it went anywhere (spoiler alert: It didn’t). I got a HP Pavillion with 512 MB of RAM1 and a 2.4 GHz Celeron processor2.

This was my first real induction into the world of computers. There was a Windows 95 computer around for a year or so when I was like twelve. But other than that, I was around pretty much no other computing devices until I got that HP. It had the newly minted Windows XP on it, which crashed and froze constantly. But I was hooked on computing of some sort. It’s funny the threads that follow through in life. It was a hobby at the time and I didn’t think much of it. But I’m confident in saying I would not be a software developer today if not for all that.

I’m a Mac

In 2004 I “became a Mac” when I bought my Aluminum Powerbook G43 and until very recently, I was confident I had made the right decision.

While in theory4 I am not as unhappy with the new generation of thin MacBook Pros as many are, I understand the frustration. And it’s clear to me that Apple’s priorities are pretty far away from the Mac and macOS. Their entire line of Mac computers right now feels lackluster and all but dead. At the same time, Microsoft is doing some pretty rad looking stuff with their Surface line.

But as a web developer who spends a lot of time in the *nix stack, I just was not sure how Windows would fit me these days. I’ve not really kept up with Windows too much except to note that Windows 10 looked like someone at Microsoft actually acquired some taste—something that has been badly lacking in Windows and other Microsoft design in general until now.

A Week in Hell

I decided to force myself to spend an entire week on Windows, doing my regular work and not booting into macOS at all. I already had a BootCamp partition running Windows 10 for testing, but I needed to get it up to speed for being a development environment. I didn’t even know what that looked like so I spent all day Saturday before my week of hell just figuring out how to get my Windows environment into a state where I could develop with it.

As you can imagine that spilled into Monday as I figured out how to get stuff done. I’m not going to outline all of my development tools and things in this article—this is just going to be general observations about Windows vs. macOS. Since I am a developer though, there will be some development stuff interspersed as part of my observations.

Window Management

When I first switched to the Mac in 2004, Window management on Mac felt weird for about 15 minutes. Then, after that, going back to Windows was awful. Alt + Tab was a joke and hard to use compared to macOS’s Cmd + Tab. Exposé on macOS was amazing. Plus, as a power user, I quickly found Cmd + ~. You see, in macOS there are essentially two virtual layers to window management (which you can easily ignore but I don’t for multi-windowed apps): The app layer where all an app’s windows are, and then the second layer of any particular app’s windows. So Cmd + Tab allows you to switch at the app layer and Cmd + ~ allows you to switch at the app’s window layer. It’s extremely powerful and over the years it has become so ingrained that I found Windows extremely limiting at first.

After a couple days I found Windows’ Alt + Tab manageable but not great. Windows 10 now shows a mini-preview of the window with the application’s icon small above the preview. I still find it a little difficult to tell what app I want when using Alt + Tab. The icon is small and my eyes do not gravitate to it, and the preview is small and does not tell me much. But because Windows only has the one layer (all windows) they can’t just show the application icon because multiple windows for any given app show up in the Alt + Tab switcher.

I found that, more often than not, I preferred to use the mouse to hover over the icon in the task bar and let an app’s windows appear so I could choose the right one. So, in a way, Microsoft has solved this layering problem at the task bar level. This requires me to interrupt my flow and mouse around. In addition, I manage my windows geographically on multiple displays. Using the task bar takes the geography away from my management of windows because it’s all down at the task bar. Sure hovering long enough produces a translucent preview of the Window where it lives on the screen, but it all requires me to reach over to my mouse, mouse to the task bar, look down to find what I think is the window, hover over it, wait for it to appear, look up to the location to verify, then click it. Now I can get back to what I was trying to do.

On macOS, the steps for me to find the right window are much easier and don’t involve the mouse. Cmd + Tab to the correct application (which is much easier to identify because of the large application icons in the switcher preview), then if necessary, Cmd + ~ to the correct window in that application.

Where Windows Window Management Is Better

I did find however, that I far prefer Windows full screen and split screen apps. The Maximize button in Windows always makes the window take up the full amount of the current display, but does not take it out of the windowing layer and environment. The green button on macOS has had a long history of not really working well (for me at least) but it got way worse with the macOS implementation of full screen. Nowadays, when you click that green button on a Mac, the window does fill the screen, but it slides over into it’s own environment and is taken out of the windowing layer and environment. You can’t use the show desktop function of Mission Control, it’s hard to access the dock, other applications are no longer within the windowing layer. macOS just makes all this frustrating. I found Windows’ maximize extremely refreshing. As a bonus, if you drag a window up and touch the top of the screen with your mouse and let go, the window will maximize5.

In addition, split screen is really much nicer on Windows as well—again because it doesn’t break the windowing model. Drag a window to any screen edge and a visual cue will tell you that the window will take up half the screen. When you let go, all the other windows will tile next to the new half-sized window. Select one and it will take up the other half—or you can just drag a window to the other side like you did the first window. Then—like split screened windows on macOS, if you drag the middle between the windows, they’ll both change size. But with Windows you can still have other windows layer in there, underneath, on top, partially covered, on top of one half screen window and behind the other, etc. It’s much more freeing than what macOS does with full screen. To be honest, I avoid macOS full screen altogether. I’ll occasionally try it again just to be sure—and even force myself to live with it for a few days, but it just doesn’t work well for me.

Where Windows Completely Sucks on Window Management

I remember from ye olden days of Windows XP that windows could get stuck off screen for any number of reasons. Did you know that Microsoft still hasn’t fixed that? They haven’t. Ask me how I know.6

Mousing, Scrolling, and the Trackpad

When I first booted into and started using Windows that fateful Saturday, the first thing I discovered is how unusable my beloved Magic Mouse was7. The lightest touch would send windows scrolling. So you would think then that it would be easy to work up some scrolling speed. See, the funny thing about that is, scrolling is just awful in all ways on Windows. There is no smooth scrolling and no momentum. You can only scroll “by line”. Maybe I haven’t found the right driver or the right “mod” but macOS does all this natively. I didn’t realize how much I relied on precise scrolling in macOS. Something as simple as scrolling an element into view in a web browser console. Normally that console is already pretty small at the bottom of the screen. When you have Windows line scrolling set to something like 4 so that scrolling is not murderously slow, you’re just as likely to scroll too far in small spaces as you are to find the thing you’re looking for. Conversely, when you set scrolling to 1 line at a time, you want to kill yourself because scrolling is so slow. macOS has solved scrolling and Windows still has no idea how to do it.

Then there is mouse preciseness. The momentum curve of moving a mouse or a trackpad with macOS makes it so much more precise and feel so easy. And yet, if you give that mouse a flick, it will be over on the other side of all three of my displays in a jiffy. There is no setting in Windows that makes the mouse feel as precise. And there is no setting that allows me to flick the mouse where I want it.

And again, like scrolling, the trackpad in Windows is a dumpster fire (.jpg). That is mostly because mouse precision is much more important on trackpads.


Here is where I was surprised. When I first switched to the Mac, that Powerbook G4 blew any PC I had ever had or used before away. Then, when BootCamp on Intel Macs became a thing, I’ve always had Windows sitting around in some form or other. And up until Windows 7, macOS performance always felt better than Windows on the same hardware. I can’t say that’s the case anymore with Windows 10. Windows consistently feels more peformant and less “laggy”. Just in terms of pure perception everything in Windows 10 feels like it happens instantly. Things sometimes feel like they’re hanging on macOS.

My perception is somewhat backed up too by the fact that the fans on my laptop run more when booted with macOS than they do when I’m booted in Windows doing all the same things. This makes me sad because macOS used to be the king in terms of general performance8.


Here again Windows 10 does better than I thought it would, and certainly better than any of its predecessors. Windows itself handles Retina just fine with one minor complaint—I have one display that is not Retina and it treats mousing from the retina screen to the non-retina a little weirdly and shows a huge size differential that macOS does not. But that’s not really a problem in practice.

Third party app support for retina on the other hand is all over the map. Chrome mostly does okay—meaning that it looks great on my two retina displays, and does sort of okay on the non-retina one with the exception that the window controls are a little wonky. The window controls are sort of blown up and think they’re still on a retina screen.

Some apps just don’t support retina at all and look fuzzy and pixelated.

It’s been some time since I can remember seeing any app or anything at all aside from a web page here or there that did not fully support retina on macOS. So score another one for the folks from Cupertino.

Design Aesthetic

I admit that the aesthetics of something can be a little subjective—even so I think that most of us can give macOS the edge here. That said, I don’t give macOS the edge by as much as I thought I would. Like I said earlier, Microsoft seems to have acquired some taste—or at least has been listening to people with taste. Most of the garishness from the XP and Vista days—and to a lesser extent the Windows 7 days—is completely gone. It has been replaced with a much flatter and more pleasing aesthetic that I am not averse to at all. I haven’t gone to the dark side, but I’m okay with the look of Windows these days.

Finder vs. Windows Explorer

File management is one area where the Windows people have always said Windows whips macOS hands down. I have always disagreed with these people and I still do. The lack of tabs on Windows Explorer is downright puzzling and an outright pain in the beep. Who knew?

Tabs aside, I find the lack of the triangular expanders right in the main view which I love in macOS Finder to be really hard to live without.

And let’s talk about QuickLook. This is, again, something I didn’t know I used so much on macOS. But I have suddenly become keenly aware of its absence on Windows.

Dev Stack

I have not found anything I can’t do on Windows. But the lack of native *nix tools does give macOS the advantage. Sure there’s Git Bash and the subsystem and all that, but it’s not the same. I find that, on Windows, I generally prefer PowerShell as it’s faster and more reliable. And almost all of my tools work in PowerShell just fine. The exception is SSH—which I understand you can set up to work in PowerShell but I just haven’t taken the time. Git Bash does SSH just fine all by itself so I use that.

Where the dev stack is actually better for me on Windows is my IDE: PHPStorm. PHPStorm is cross platform and written in Java. Java on Windows has far better performance and support. And there just aren’t any other good IDEs for PHP out there. And there are a few other Java tools I use9 that certainly do have better support and performance on Windows.

There’s also WinSCP—which, honestly, while being very “Windows-y” is a shining example of great dev apps on Windows. The closest I have come to an (S)FTP client as good as WinSCP on macOS is ForkLift. I like ForkLift just fine and use it all the time. But WinSCP has the edge here.

As far as working with tools considered more as part of the LAMP stack like PHP and Composer from the command line in PowerShell, I found initial set up to be a little more difficult. But once running, they work just fine in Windows.

In Conclusion

So as I wind this gargantuan amount of words about operating system choice down, I’m ready to admit that I do know who I am for now. I’m still a Mac. But I find the gap between the two warring worlds to be lessening. Particularly in light of Apple’s clear abandoning of the Mac as a platform they are invested in and care about10, I feel this has been a fruitful exercise. I learned that, while I still give the edge to the Mac and will probably still be buying and sticking with Macs for the foreseeable future, things in Windows land aren’t as bad as they used to be. And in some areas, things on the other side of the fence are actually better than on the Mac—a phrase I thought a few years ago I would never utter (or write).

I also found the exercise useful to hone and sharpen my toolset to be platform independent. As Apple continues to make me more and more uncomfortable with their direction and (lack of) support for me as a developer and power user, I have become increasingly desirous to decouple my life and toolset(s) from any one specific platform. As part of this exercise I have abandoned some tools and/or replaced them in favor of more platform independence.

Going forward, I plan to spend every other week working in Windows. For the past several weeks that is exactly what I’ve been doing. I’ll work in Windows for one week, then I’ll work in macOS for a week. Back and forth it goes. I think it’s been really good for me.

I’ll still make fun of people who bring thirty-pound laptops running Windows to Starbucks. But I’ll have to stop making (so much) fun of Windows itself.

  1. A fair amount at the time actually. 

  2. I know, I know… 

  3. I think that one was the first generation following the Titanium. If not the first, then it was the second. It was early on. 

  4. Theory because I still have a previous generation computer. 

  5. There are also keyboard shortcuts to maximize windows. 

  6. No, actually, please don’t. It’s a sore subject. 

  7. Yes, I installed all the BootCamp drivers and everything. 

  8. Excluding games because game makers have always spent their time optimizing for Windows environments. 

  9. Such as DBeaver 

  10. Please, please, please, please prove me wrong Apple. I want you to prove me wrong. And a lot more than just reassuring platitudes from Tim Cook, I need to see some money where the mouth is at. 

Available for Work as of April 3

Hi Everyone!

Just wanted to let you know that I’ll be taking on freelance work starting on April 3rd. I’m looking for small to medium sized projects. I love:

  • Jekyll
  • Frontend Development
  • Style Guides/Design Systems
  • Teaching Flexbox and CSS Grid

I have limited availability, so I can only take on a few projects. Go to hire.ttimsmith.com to find out more. Can’t wait to hear from you!


Self-Doubt and My Interview With Shopify

Helen Tran wrote an awesome article for fem-designers-in-tech:

Self-doubt is healthy in doses but be careful what story you are telling yourself. Self-doubt is a mechanism to help you gauge what’s real not to over-exaggerate anxieties. Self-doubt is, “Hmm, I should think about this a little.” not, “I am terrible at this.” This is many steps too far in the wrong direction.

Her advice struck a cord with me, so I wrote her an email:

Hey Helen!

Loved this article! I’m not a female, but I find this article to be excellent advice. I’m a Latino, and I started in this industry really young. I was 15 when I got my first job. I turn 25 this year. I struggle with every point you talk about here.

I honestly believe this is why I didn’t get the job at Shopify. I didn’t sell myself in the interviews and instead I came off as inexperienced and unsure about learning new things. I constantly sell myself short. My lack of belief in myself leads to lack of belief from others. I’m determined to change that this year. I’ve seen people with much less experience advance way quicker than I have.

Anyway, all this just to say thank you. This article may not be written for me, but it sure does help.


In case you didn’t know, I interviewed with Shopify in January. They flew Kelly and I out to Toronto for an awesome 4 days. All my friends said a variation of the same thing:

If they’re flying you out, they must really want to hire you!

I doubted. Something told me that I’d screw this up and they wouldn’t end up hiring me. Still, we had a great trip. Kelly and I looked at apartments, ate amazing food, and fell in love with the city. We began to imagine what our lives would be like in Toronto, and it was pretty exciting.

We flew back to Minnesota, and all my friends and family were eager to know how it had gone. I thought the interviews had gone pretty well and I’d foolishly gotten my hopes up. A couple days later, I received the call.

We’re moving forward with other candidates.

In film you’ve seen this moment. The character hears the important line and the rest just becomes muffled. That’s kind of how this moment felt. It might just be that I’m a very emotional person, but I don’t remember the rest of the conversation. I was too busy dealing with the increasingly large knot in my throat. I do remember saying thank you, then hanging up.

I was devastated. I cried. I really wanted the job. I wanted the change of scenery. Deep down, I wanted the validation of a company like Shopify being interested in me and my skill set. I spent a few weeks moping and being sad.

Once the emotion cleared and I could actually think about it, I realized it was partly my fault. I’m sure there were many factors involved but one of the biggest is that I sell my own self short.

If I don’t believe in myself and my skills, how is anyone else supposed to? I do this constantly. I undersell my expertise, and what I can bring to a team.

I often still feel like that fifteen year-old that’s just getting started. So many moments where I feel like a fraud about to be discovered. I’ve gone to extreme lengths to prevent people from knowing how old I am. I always feel them finding out will invalidate anything I’ve said or made. The ageism I’ve experienced along my career has only served to reinforce that feeling.

Like I said in my email to Helen, this is the year I decided to change this. I’ll be speaking at a local conference here in the Twin Cities and have started to send proposals to many others around the globe. I’m also writing a lot more about development and design here on this site.

I’m done letting these insecurities win. I’m done trying to get validation that I shouldn’t need. I’m me and I’m awesome. If you’ve felt like this, I hope you join me and follow Helen’s advice.

Vacation to Las Vegas

Dear Reader,

On Sunday, I’ll be traveling to Las Vegas for a week. While we’re in the area, we’re going to visit the Grand Canyon, the Hoover Dam, but most importantly, In-N-Out. For the uninitiated, In-N-Out is a magnificent place with burgers full of wonderfulness and deliciousness in every bite.

Regular posting will resume on March 20th. Have a great week!


Week in Review: March 10, 2017

Greetings, you fine-looking people!

This week was a busy one with a lot of news. I didn’t have enough time to write about each of them so I’m putting them all together in one post á la Katie Floyd. Here are the stories that were interesting to me this week:

  • Reflecting on One Very, Very Strange Year at Uber by Susan Fowler
    This one happened while I was out with a cold. What a massive mess. Uber, time and time again, proves that their culture is toxic in all new levels. HR is shown to be useless, and I find it baffling that anyone would think they could get away with this. I’ve deleted my Uber account and their app from my phone, and I’d advise you to do the same. Their complicity in this sexual harassment cannot be tolerated.

  • Firefox 52 and Chrome 57 landed in the same week, and with it, CSS Grid support in both of them. CSS Grid is no longer behind a flag in two major browsers, and you should be learning it. Jen Simmons’ article will point you in the right direction. Micah Godbolt’s post is great too. I also recorded a video on making a portfolio layout with CSS Grid. I’m excited to see all the new things we’ll do.

  • No-Pressure Blogging by Manton Reece
    This sentiment from Manton spoke to me. I struggle with the feeling that my words or ideas aren’t good enough to write. But the truth is, not every post is going to be revolutionary. Honestly, I still haven’t published mine. Who knows if I ever will. That’s ok. It’s a blog post and as long as I’ve documented something for myself and helped a person or two, I’m ok with that.

  • Why I Left Mac for Windows: Apple Has Given Up by Owen Williams
    I hadn’t noticed how much Apple has ignored the Mac. Some of the features that I love about the Mac and have made it great for me were introduced back in 2012. It’s sad. I’m not about to switch to Windows, but if nothing changes, the switch may be inevitable.

  • Just Another HTTPS Nudge on CSS Tricks
    Chris Coyier outlines a scary scenario that drills home the point on HTTPS. We should all be using it. While Let’s Encrypt has made the process easier, enabling HTTPS and renewing certificates is not as pain-free as it should be.

  • The Trouble With Cross Posting by Jonathan Hays
    I’ve been doing a lot of research into microblogging these days and one of the biggest frustrations is not being able to cross post effectively. I’m looking forward to seeing Micro.blog fix this.

Hope you had an excellent week, and have a restful weekend.